Elements of a Typical Sitecore Page
While there are a handful of specialized pages on the CCBC website, most pages have a standardized underlying structure — what we call a "typical page." Within this basic structure are many options for how a page can be configured.The image and descriptions below explain the most prevalent elements that can exist on a typical page, including navigation types and content items.
1. Page header
The page header appears at the top of every page on the site.
It includes the following components:
- Utility navigation: One click access to registration information, the CCBC Library, catalog, CCBC Online and frequently used student web services. This sections loads on every page of the CCBC site.
- CCBC logo: Official college logo linked to homepage.
- Site search box: Allows users to use the website's internal general site search feature.
- Primary navigation: Also referred to as the mega navigation, it contains the highest level organizational categories for content on the website. Each tab links to a landing page and reveals a drop-down for direct access to important content and tasks in each section.
2. Breadcrumb navigation
A secondary navigation that traces the current page you are on back to the CCBC homepage.
3. Page title
The official "name" of the page. The page title will display in the URL of the page. It also plays an important role in optimizing the web page for both internal and external searches, such as Google.
4. Left navigation
Located in the left-hand column, it contains links to the main sections of the CCBC website and provides easy access to this section of the website no matter what page you are viewing.
5. Carousel
Displays slides containing images with optional captions above the main content area. If multiple slides are present, users can move back and forth between the images by clicking left/right arrows.
6. Subtitle
Is a visual queue to users regarding the content of the current page. Also is important for search optimization.
7. Main content area
Unique content for the page exists here. This is the center area on a page, where the majority of updates are made by content contributors and owners.
There are multiple renderings that can be placed in the main content area, such as:
- Body copy field: The default field for placing content at the top of the main content area. The body copy field plays an important role in search engine optimization.
- Accordion: These ‘drop downs’ allow you to display a large amount of information, in a clean and space-saving arrangement.
- Orange border blocks: Are a great way to group related, but separate, chunks of information on a page.
- Chunk: Similar to the body copy field, a content chunk allows copy to be placed after other renderings. For example, you would use a chunk when content is needed below an accordion.
8. Right rail
Located in the rightmost column of the page, this area is designed to provide a place for additional resources to supplement the primary content and tasks in the main content area.
The right rail can include:
- Contact us block: Used to display contact information for one point of contact.
- Connection block: This block has a similar look as the Contact us block, and is primarily used to display multiple contacts within one block. Additionally the Connection block is a way to feature other content in the right rail, such as maps/directions.
- Call to Action (CTA): Help you drive users to relevant tasks and related resource information by providing a prominent visual element.
- Event block: All events created in Sitecore are tagged. Event blocks can be configured to display events on specific pages in the website based on these tags. For example, on the Arts and Culture page, all events/performances with the tag "arts" will display in the event block on this page.
9. Footer
The footer appears on every page on the website and includes links to maps, directions and general contact information, social media and links to other important resources for various audiences.
