The global navigation is a standard part of the NMSU web site layout that presents enterprise-level tactical links, navigation, and search.
The purpose of the global navigation element is to ensure that specific content, including access to the NMSU enterprise web search and crosslinks to important NMSU system resources, the Alumni site, Apply, and Give, are available (even if collapsed) on every page within the institution's website ecosystem.
All NMSU websites must present the global navigation, exactly as it appears in the specifications found on this page. This includes matching the fonts and the exact links found within collapsed state. News/Blog sites templates do not include the global navigation and it is not required.
Updates to the global navigation will be made regularly. This page will contain the version history and changes.
If you participate in administering a website that is NOT part of the University's central Cascade CMS offering, please note that you will need to update this code regularly as it changes system-wide. If you use the University's central brand templates, the global navigation changes will be updated automatically. Exceptions are made for Community College and Global Campus sites.
Global Navigation Presentation: Desktop Views
The desktop view of the global navigation element spans across the full width of the browser immediately above the web site masthead. It includes a crimson bar that divides the global navigation region from the rest of the web site masthead area.
Collapsed State
The default state of the global navigation element is set to be collapsed.
Style Rules:
The global navigation height must be exactly 28 pixels
The background color of the container is #8c0b42.
Default links should be Apply, Visit, and Give. Some exceptions apply depending on organization or department.
Links should be bold, uppercase and 14px
The color of the "University of Miami" type is #1f7c47.
The "search" expander icon is part of Font Awesome Icons
The "search" expander icon color is #00c9a7.
The horizontal rule framing the bottom of the container is white and set to 1 pixel.
Expanded State
The global navigation expanded state appears by activating the "search" button. It reveals NMSU system wide quick link navigation and a search bar.
Style Rules:
There is no transition effect to the expand or collapse action.
The global navigation height must be at least 350 pixels
The background color of the container is #f8fafd.
All elements within the global navigation should be setup within a container that has a max-width of 1140 pixels
The "Collapse" button should be right-aligned to the browser's right margin.
All elements within the sliver should be vertically-aligned so as to allow roughly equal padding of 48px above and below the element.
The quick links included should be uppercase, bold and 14px
The quick links color should be #8c0b42
The hover state for quick links items should not use text-decoration.
The Search Box container should feature border-box with a 1 pixel border with the color #e7eaf3
The font for the search box should be Open Sans with the color #1e2022
The "Search" button should be #8c0b42
The search associated with this submission element should connect to an enterprise NMSU search and should not feature a local search of the current site.
Global Navigation Presentation: Mobile Views
The mobile view presentation of the global navigation is similar in many respects to the desktop view. This includes the appearance of the "search" icon referenced in the desktop view specifications.
However, some unique aspects of the mobile presentation are included below.
Style Rules:
"search" expand control changes to a simple touchable icon (from the button treatment present on desktop view).
No transition effects are present on expand or collapse.
Expanding the global navigation reveals enterprise search region without quick links using appropriate padding.
Navigation items in the collapsed stated are included in a drop down menu.
Global Navigation Items in the Expanded State
The quick links that appear in the expanded state of the global navigation may only be edited and changed by the Marketing and Communications. Areas who build global navigations of their own to comply with our visual identity may not change or present alternative material in the expanded state. The purpose of the global navigation is to present consistent enterprise options on all Web pages.
The following links are the exact labels and links required within the expanded global navigation element navigation. The left-aligned navigation links should be:
Unique Aspects to the Global Navigation on the NMSU Homepage and Top-Tier Website
Individuals who browse the top-tier website may encounter the global navigation element in a slightly-altered presentation.