Breadcrumbs
Breadcrumbs appear on most pages, and let you know where you are on the website by providing links back up the folder hierarchy to the PCC homepage. The breadcrumbs make it easy to backtrack on the website.
Styling
JavaScript creates and inserts the links at the top of the content area. Most site homepages don’t include breadcrumbs, especially if the site is in WordPress.
CSS removes any top margin and padding from the first element of any kind after the breadcrumbs. This makes sure there’s equal space between the breadcrumbs and the first element in the content area on all pages.
Responsive behavior
No change.
Development info
- Stylesheet location:
/_source/styles/base/_global.scss - Same across all template variations.
- Note that each folder shown in the breadcrumbs must have an index page, otherwise a 404 page will display for that link.
- The folder names are determined by converting hyphens to spaces and capitalizing each word (/student-life/ = Student Life). Name variants can be hard-coded into the script if needed.