User Interface

All websites on our new web platform leverage Drupal 9. The underlying user interface (UI) that's used when building your website is that which comes with Drupal 9. This UI is optimized for user experience, accessibility and mobile responsiveness. The primary UI element that you'll use to move throughout your website is the admin toolbar.

Admin Toolbar

Once you're logged in to your site, you'll notice a toolbar at the top of your browser window. This toolbar is used to direct you to primary administration pages (e.g., content overview, media library, menu administration, taxonomy manager). Additionally, the toolbar contains the primary button for logging out of your user account and flushing your site's cache. More information on each of these topics will be explained later in this training.

General Site Structure

Your site is divided into 5 regions: the header, lateral navigation, main navigation, content region and footer. For each page of your site, the header, menu and footer remain static. The content region displays the content you added for the respective page.

Header

The header region of your site contains the primary unit, department or program wordmark. Additionally, the header contains a link to myUK, a toggle for the college's custom search and a toggle for your site's lateral navigation. If your site is affiliated with a unit and the primary site for your unit, department or program, the title of your site will also be printed in the header.

Lateral Navigation

The lateral navigation displays site-specific and college-specific quick links and contact information for your unit, department or program, as well as icons for the social media accounts associated with your unit, department or program. If these aren't added when your site is created, please submit a web support request via this web form to request your social media accounts be associated with your site. On desktop, this navigation is toggled using the "Resources" button in your header. On mobile, the lateral navigation is embedded in the mobile menu.

Main Navigation

The menu region of your site displays the menu items added to your site's main navigation. On desktop, the main navigation is printed inline with the ability for menu items below the top menu level to be accessed through a drop-down functionality when hovered. On mobile, the main navigation is bundled with the lateral navigation to form a mobile-responsive menu that allows users to switch seamlessly between menus. This will be discussed further in module 3.

Content Region

The content region of your site is dynamic. As you build your website, the content region of each page can be modified to meet your intention for the respective page. New pages are added as content. To add new content to your site, you'll need to know which type of content you want to add. This will be discussed further in module 2.

Footer

The footer region of your site contains college- and university-level branding requirements and quick links. This footer is shared across all CAFE websites on the new platform and is not able to be changed on a site-by-site basis. You can, however, request to disable the pre-footer region (containing the "apply now," "plan a visit" and "give now" links) if your site is not related to an academic program.

Do you need support?

If you have questions at any point throughout this training, please submit a request to Ag Comm Web Services through this web form.