Skip to main content

Page Layouts

Every page has three main parts: the header, the content layout, and the footer. Page Layouts provide a consistent structure and style for these parts. When a Page Layout is modified, all pages that use it are updated. 

Currently, our design system includes three primary Page Layouts. The most significant difference between these layouts is their headers. 

  • Site Main - header includes the university logo, university name, and core navigation.
  • Site Specific - allows you to set the site name (title and subtitle) and replaces the core navigation with your site navigation, where you can customize the menu items.
  • Site Standard - primarily for academic department sites, you can set the school or college name with the core navigation, a subheader with the department name, and the "department switcher" menu for end users to navigate departments and majors.

The Header

SCU's global navigation, site search, audience gateways, and core navigation or site-specific navigation menus appear in this section. The header should be consistently presented on pages within a site. Header options vary based on the page layout you're using. Review the Site Main and Site Specific sections for choices and options.

The Content Layout

This area is designed to be flexible and adaptable to various content. The default layout offers a column spanning two-thirds of the page for main page content, with the remaining one-third used for the right column sidebar. There are a few limitations in what content goes in which area of the content layout - you can easily switch the position of any content type from one area to another.

Another variation on the default layout is to add two columns with a 50% width to the main content area. As needed, you can switch the page layout to Full Width, allowing the full page for content that would otherwise exceed the space allowed in a standard layout.

Review the Content Layout section for a diagram of the areas available for positioning content.

The Footer

By default, the footer will include contact information for the university and general information links, but you can customize that by adding a Footer Configuration section to your site.

 

Submit a Web Support Ticket