Site Header Styles

The site's header displays on every page of your site, assuring visitors that they are in the right place.

The header is the top-most section of your site, containing the logo, site title and menu.

The header displays on every page of your site. Its purpose is to identify your site, clarify your site’s affiliation within the university, and, most importantly, help visitors determine whether they are in the right place.

If you believe your site has the wrong logo, please contact us at sites@wustl.edu.


Header styles

There are two header styles available in the theme: default and condensed.

Default header

When you set up a new site, it will automatically come with the default header, and most WashU Sites site owners choose to keep it.

It displays the logo in a red banner at the top, followed by the site title in large dark gray lettering, with the main menu below it in a dark gray banner. If you have designated an affiliation for your site, it will appear just above the title in smaller red all-caps lettering, and acts as a link to the affiliated site.

Learn how to change your site title and add and an affiliation >>

Condensed header

The condensed header is used when applying the homepage spotlight. However, it can be also be applied without the spotlight image.

As pictured above, the site title and menu align on a single gray bar, rather than being stacked. The arrangement moves these elements higher up on the page to shift focus to the page’s content below.

You will notice that there is less room for the main menu, and fewer parent pages will fit before rolling into the “More” dropdown. The number of pages that shows is determined through a combination of characters and pixel space, as divided between the site title and the menu. It also changes based on the user’s window width and screen resolution. 

See the Navigation Menus Guide to learn how to avoid the “More” dropdown.

Good to Know
Site affiliation will not display in the condensed header.


How to apply header styles

To change your site’s header style:

  1. In your site’s dashboard, go to Appearance > Customize.
  2. Click the arrow on the right of the Header line.
  3. Select Default or Condensed. A preview of your selection on your site’s homepage will appear.
  4. Click the orange Publish button at the top of the page.