Skip to main content

Search Form - (Section 4a)

Suggested Use: Use if mobile toggle functionality is needed.

Lorem ipsum dolor

Lorem ipsum dolor sit amet,
consectetur adipiscing elit

Lorem ipsum dolor sit amet

Lorem ipsum dolor

Lorem ipsum dolor sit amet,
consectetur adipiscing elit

Lorem ipsum dolor sit amet

Lorem ipsum dolor

Lorem ipsum dolor sit amet,
consectetur adipiscing elit

Lorem ipsum dolor sit amet

Style Management

The following labels refer to styling options/classes in the "STYLE" dropdown menu located in the toolbar in every Custom HTML Module's content editor:

  • Heading Text:

    Headline 1

    Headline 2

    Headline 3

    Headline 3 - Roboto Regular Font

    Headline 4

    Headline 5

    Headline 6

  • Body Text:

    Paragraph 1 - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

  • List:

    • This is a bulleted list item
    • This is a bulleted list item
    1. This is a numbered list item
    2. This is a numbered list item
  • Links:

  • Buttons:

    Button Primary
    Button Secondary
    Button Tertiary
  • Spacing:

    Lorem ipsum dolor sit amet.

    ↑ Margin Top 10px

    Lorem ipsum dolor sit amet.

    ↑ Margin Top 20px

    Lorem ipsum dolor sit amet.

    ↑ Margin Top 30px

Page Templates

What page templates are available to create new pages with?

The following page templates are available in the "CMS Primary Theme" theme:

In which theme should I create my page? / Which theme should my page be assigned to?

To use one of the page templates, you must create your page inside the theme where the desired page template resides. You may later assign the page to another theme if needed.

See General Advice & FAQs for more details.

What if I don't need all the sections used in a template?

Before using a CMS page template to create a page, determine if you’re going to need all the sections used in that template. Then, after using the template to create a new page, remove the sections from the page which aren’t needed BEFORE SAVING THE NEW PAGE. This prevents those sections from ever being created and we avoid cluttering the system with unused sections and modules.

Can I create a CMS page without using one of the CMS Page Templates?

See General Advice & FAQs.

Custom HTML Modules: Content Editor (WYSIWYG) FAQs

How do I replace placeholder ("lorem ipsum") or unwanted text content?

The content editor can be finicky. To replace placeholder or unwanted text, we recommend that you first click the “BLOCKS” button in the toolbar to reveal outlines surrounding block-level elements. Then, select the text you wish to replace and type in your desired text. Or, you can place your cursor at the end of the text you want to replace, add your desired text, and then select and delete the placeholder text preceding it. We do NOT recommend selecting all placeholder text in the editor and deleting it before you add your desired content. As a result you may accidentally erase necessary markup that the content depends on. It is always best to edit text elements one at a time rather than deleting everything you don’t want from the start.

Can I copy/paste from other sources?

Be very careful when copy/pasting text content from other sources into a Custom HTML module's content editor. When copying from an external document, take steps to ensure the text you are copying is plain text (as opposed to rich text.) When copying from a web page, make sure you are ONLY including text and not actual HTML tags (<p>, <br>, etc.) as this could result in unintended styling/format inconsistencies.

How do I change the appearance of text content (color, font size, etc)?

The "STYLE" dropdown in the toolbar can be used to edit the styling/appearance of content. Keep in mind that when you add a style from the dropdown, it does not overwrite other styles previously applied to the element. This allows greater flexibility in cases where you may need more than one style applied, but you will need to remember to uncheck undesired styles after applying them.

Please refer to Style Management for examples of classes/styles you may apply.

Keep in mind that changing the appearance or styles of text should be done SPARINGLY - for the sake of consistency across pages, it is best to stick with the module's default styling whenever possible.

How do I add/edit a link?

The "insert/edit link" button in the toolbar is used to create and modify links:

To create a new link, type your desired link text within the content editor, select it, and then click the "insert/edit link" button. This may be tricky if you're creating a new link next to an already-existing link. To do this, place your cursor at the end of the existing link's text and then press the right arrow key, so your cursor is outside the existing link. Then, type the new link's text, select it and click the "insert/edit link" button.

To modify an existing link, click into the middle of the link text within the content editor, then click the "insert/edit link" button.

Note: Using proper link text is very important. For more details, see "Does it matter what I use for [clickable] link text?" in General Advice & FAQs.

How do I add/edit an image?

The "asset picker" button in the toolbar allows you to add images into the content editor. To modify an existing asset, click the asset and then click the "asset picker" button. Not all custom HTML modules were made with the intent to have an image placed in them. (Tip: If your default placeholder content did not contain an image, you should probably avoid adding one with this tool.)

Note: If you're including an image in a Custom HTML module, remember to consider the image alt text (which is editable through the "asset picker" button), and include a value when necessary. For more details, see "Do I need to update/include alt text for every image?" in General Advice & FAQs.

How do I add a code snippet?

The "insert code snippet" button in the toolbar adds pre-made snippets of code into the content editor. Note that code snippets are often (but not always) used as a way to revert either the entire content of a Custom HTML Module to its default state, or to revert a part of its content to its original state. In many cases you will not need to use code snippets unless you're attempting to "fix" a module (i.e. bring back original content which was since removed.)

Additionally, code snippets are used as a way to add specific html into your content editor that is either difficult or impossible to achieve without editing the actual source code.

IMPORTANT: Be very careful to only use code snippets that are intended for use in the specific module you’re editing. In most cases the name of the code snippet should partially or exactly match the name of the module you’re editing. A list of all code snippets that are intended for use within a module will appear in that module's parent section's documentation in the Section Guide. Do not use a code snippet when the section name in the title of the code snippet does not match the section you are currently editing. For example, if you're editing a section created from a section template labeled as "Section 1" you should only be using code snippets whose titles include "Section 1."

I've messed up my edits and would like to revert to the original "lorem ipsum" placeholder content. Is there a way to do that?

Check to see if the module you're editing has a default code snippet available. The name of the snippet should match the name of your module (minus the given section name prefix.) If so, you may delete the entire content and then insert the appropriate code snippet. Some modules don't have default code snippets available, but they may have other snippets which could replace specific portions of your content.

Does it matter which levels of headings (H1, H2, etc) I use in my content?

Yes. For SEO and accessibility purposes, it is important that your page’s heading structure is hierarchical. This means that your page’s top heading needs to be an h1 heading.

You should also be careful to avoid skipping heading levels (i.e. using an h3 heading before an h2 has been used, etc.) If you need to change the appearance of a heading without changing the level, apply one of the heading classes from the content editor's "STYLE" dropdown (see Style Management for a list of these heading style classes.)

General Advice & FAQs

How can I ensure that my content will be accessible to all users?

Be sure to follow all recommendations and instructions given in this guide, particularly the recommendations involving link text, image alt text, and heading levels. To learn more about accessibility, please see Accessibility for Radancy CMS Publishers.

Can I change the layout assignment of a page/section/module?

You should never change a layout assignment unless specifically instructed to do so in the relevant section's documentation found in the Section Guide. This will almost always lead to unintended results.

Can I add a module to a section?

You should never add a module to a section unless specifically instructed to do so in the relevant section's documentation found in the Section Guide. This will almost always lead to unintended results.

When I'm adding a section from the "Add New" section menu to a page, what should I name my new section?

To avoid future confusion, especially for other CMS users who may need to edit/update the content you're creating, naming conventions should be consistent throughout the site. When creating a section that you anticipate will only be used on the page you're adding it to, we recommend the following naming convention: [Page Name OR Abbreviated Page Name] - [Section Template Name] [Number (only include if you anticipate other sections of the same template will be added to the same page.)] For example, "Benefits - Full Width Copy" or "DEI - Full Width Copy 1." If you anticipate that the section you're creating may be used on other pages as well, we suggest giving it a name that summarizes its purpose/intent rather than its content or context (which may change or be updated later.) For example, "Human Resources Job List" or "Annual Job Fair CTA."

Note: While you CAN change a section's name after creating it, you will NOT be able to change the names of the modules included in the section (which will, by default, include the ORIGINAL section name.) So we recommend that you carefully choose a good name for each section you create.

Can I create a CMS page without using one of the CMS Page Templates?

Yes, but this is not recommended as creating a page without using a CMS Page Template will require you to select a page layout. To avoid selecting the incorrect layout, we recommend using one of the available CMS Page Templates, in all cases.

If you are looking to create a "blank" page, see the next question.

How do I create a "blank" page?

To create a blank page, click the "Add Page" button in the "CMS Primary Theme" theme and select the [TEMPLATE NAME] page template.

Which theme should my page be assigned to?

All CMS pages should be assigned to the "CMS Primary Theme" theme.

DO NOT assign any CMS pages to the "Default Theme (GST)" theme. This theme is enabled for CMS due to system requirements, but it is NOT intended to be used as a theme for CMS Pages.

Do I need to update/include alt text for every image?

Every time you add or replace an image file, you should consider whether to include alt text for the image. In some cases, such as when the image is considered descriptive and not essential to the page content, alt text may be left blank. For more details, please see this alt text decision tree. Not only are these considerations essential in making the site accessible to non-visual users, it will also improve SEO.

Does it matter what I use for [clickable] link text?

It matters a lot. To make links accessible to all users, use link text that would make sense to users if taken out of the surrounding context. For example, "learn more about our benefits" is acceptable, whereas "click here" or "learn more" are not. This is important in all situations but be particularly careful when adding/editing links inside Custom HTML modules, as you'll have full control over what text is included in a link.

How do I update/add a hero banner to my page?

If you are using Section-3b or Section-3c, upload your banner image through the "Mobile Banner" field in the Media Module of the respective section.

You can also add banner text using the Custom HTML Module.

Recommended image size: 488 x 275.

CMS User Notes

How can I add to or update the notes to this section?

Find this section ("CMS Guide - CMS User Notes") in your section list and edit its "CMS Guide - CMS User Notes-Section 1 - Copy" Custom HTML Module to add as many notes as you'd like right here. Be careful to not delete this instructional text, so that it may be referenced later on.

Add your notes below:

Section Guide

Important! Before using a section from this guide, please read the corresponding documentation for that section. Documentation is found above each section in this guide.

Note that section titles are color coded based on which menu they can be found in after clicking the "add section" button on any page:

Red - find this section in the "Use Existing" Menu.
Green - find this section in the "Add New" Menu.

Keep in mind that when you edit a section from the "Use Existing" Menu, you are editing every instance of that section. Sections added via the "Add New" Menu are safe to be edited freely, as a new instance of the section is created every time it's added to a page.

Hero w Gradient - (Section 3b)

Suggested Use: Use this section for a wide banner with a predefined gradient background and heading text positioned toward the left center.

Notes: This section is available in three predefined gradient color variants. The gradient colors are fixed and cannot be customized. You can update the heading text from the Custom HTML module.

Available Code Snippets:

  • Section 3 - Heading

Lorem ipsum Dolor

Hero w Gradient - (Section 3c)

Suggested Use: Use this section for a wide banner with a predefined gradient background and heading text positioned toward the left center.

Notes: This section is available in three predefined gradient color variants. The gradient colors are fixed and cannot be customized. You can update the heading text from the Custom HTML module.

Available Code Snippets:

  • Section 3 - Heading

Lorem ipsum Dolor

Hero - (Section 3c)

Suggested Use: Hero Banner with Left aligned text and Right aligned image "488x275" with Gradient Background color

Notes: N/A

Available Code Snippets:

  • [code snippet name]: N/A

Lorem Ipsum Dolor

Placeholder Image

Hero w Gradient - (Section 3d)

Suggested Use: Use this section for a wide banner with a predefined gradient background and heading text positioned toward the left center.

Notes: This section is available in three predefined gradient color variants. The gradient colors are fixed and cannot be customized. You can update the heading text from the Custom HTML module.

Available Code Snippets:

  • Section 3 - Heading

Lorem ipsum Dolor

Hero w bg Image - (Section 3e)

Suggested Use:Use this section for a wide banner image with heading text positioned over the image toward the left center.

Notes: You can update the background image from the Media module and update the heading text from the Custom HTML module. Recommended image size is 1440 × 350 pixels.

Available Code Snippets:

  • Section 3 - Heading

Lorem ipsum Dolor

Placeholder Image

Hero w Copy and Image - (Section 3f)

Suggested Use: Use this section for a split-layout banner with a large heading on the left and a visual/image area on the right.

Notes: This section is available in three predefined variants. Gradient colors cannot be customized. The heading text and image can be updated from the Custom HTML and Media module respectively.

Available Code Snippets:

  • Section 3 - Heading

Lorem ipsum Dolor

Placeholder Image

Hero w Copy and Image - (Section 3g)

Suggested Use: Use this section for a split-layout banner with a large heading on the left and a visual/image area on the right.

Notes: This section is available in three predefined variants. Gradient colors cannot be customized. The heading text and image can be updated from the Custom HTML and Media module respectively.

Available Code Snippets:

  • Section 3 - Heading

Lorem ipsum Dolor

Placeholder Image

Hero w Copy and Image - (Section 3h)

Suggested Use: Use this section for a split-layout banner with a large heading on the left and a visual/image area on the right.

Notes: This section is available in three predefined variants. Gradient colors cannot be customized. The heading text and image can be updated from the Custom HTML and Media module respectively.

Available Code Snippets:

  • Section 3 - Heading

Lorem ipsum Dolor

Placeholder Image

Search Form - (Section 4a)

Suggested Use: Use if mobile toggle functionality is needed.

Job List - (Section 5a)

Suggested Use: Non Interactive Job List Section

Notes: Can use this to make a variant for Tablist job list

Available Code Snippets: N/A

Jobs For You

Saved Jobs

You have not saved any jobs yet.

Viewed Jobs

You have not viewed any jobs yet.

Copy - (Section 10a)

Suggested Use: Page Introductions, General Copy - Center Aligned

Notes: Use an H2 for the section heading. Supporting content can be added below the heading as paragraph copy. The heading and copy are center aligned within the section.

Available Code Snippets:

  • Section 10 - Intro Text

Lorem ipsum dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

Copy - (Section 10b)

Suggested Use: General Copy, Supporting Content - Full Width Left Aligned

Notes: This variant does not include a section heading. Use paragraph content centered within the full-width content area.

Available Code Snippets:

  • Section 10 - Description

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

Copy - (Section 10c)

Suggested Use: Page Introductions, General Copy - Left Aligned

Notes: Use an H2 for the section heading. Supporting content can be added below the heading as paragraph copy. The heading and copy are center aligned within the section.

Available Code Snippets:

  • Section 10 - Intro Text

Lorem ipsum dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

Copy - (Section 10d)

Suggested Use: General Copy, Supporting Content - Full Width Center Aligned

Notes: This variant does not include a section heading. Use paragraph content centered within the full-width content area.

Available Code Snippets:

  • Section 10 - Description

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

Copy w CTA - (Section 10e)

Suggested Use: Page Introductions, General Copy - Center Aligned with CTA

Notes: Use an H2 for the section heading with supporting paragraph content below it. The heading and copy are center aligned. A CTA can be added below the content to direct users to another page or relevant action.

Available Code Snippets:

  • Section 10 - Intro Text w CTA

Lorem ipsum dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

CTA

Copy w CTA - (Section 10f)

Suggested Use: Page Introductions, General Copy - Left Aligned with CTA

Notes: Use an H2 for the section heading with supporting paragraph content below it. The heading and copy are center aligned. A CTA can be added below the content to direct users to another page or relevant action.

Available Code Snippets:

  • Section 10 - Intro Text w CTA

Lorem ipsum dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

CTA

Copy h3 - (Section 10g)

Suggested Use: Page Introductions, General Copy - Center Aligned

Notes: This variant is similar to Section 10a, but uses an H3 instead of an H2 for the heading. The heading and supporting content are center aligned.

Available Code Snippets:

  • Section 10 - Intro text H3

Lorem ipsum dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

Copy h3 - (Section 10h)

Suggested Use: Page Introductions, General Copy - Left Aligned

Notes: This variant is similar to Section 10c, but uses an H3 instead of an H2 for the heading. The heading and supporting content are center aligned.

Available Code Snippets:

  • Section 10 - Intro text H3

Lorem ipsum dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

Form - (Section 11a)

Suggested Use: Talent Community Login Form

Notes: Form use for CRM

Available Code Snippets: N/A

Join Our Talent Community to Stay Connected!

You’ll receive job alerts along with direct emails from our recruiters. You’ll also have the option to opt in to receive text messages from our recruitment team.

Interested InSelect a job category from the list of options. Select a location from the list of options. Finally, click “Add” to create your job alert.

Copy and Image - Section 13a

Suggested Use: Feature Content, Page Introductions, Promotional Content - Copy and CTA Left, Image Right

Notes: This variant uses a two-column layout with the heading, supporting copy, and CTA on the left and an image on the right. Recommended image size is 414 × 284 pixels. The image can be updated from the Media module, while the heading, copy, and CTA can be updated from the Custom HTML module.

Available Code Snippets:

  • Section 13 - Copy

Lorem Ipsum

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere.

CTA

Placeholder Image

Image and Copy - Section 13b

Suggested Use: Feature Content, Page Introductions, Promotional Content - Image Left, Copy and CTA Right

Notes: This variant is the reverse layout of Section 13a, with the image on the left and the heading, supporting copy, and CTA on the right. Recommended image size is 414 × 284 pixels. The image can be updated from the Media module, while the heading, copy, and CTA can be updated from the Custom HTML module.

Available Code Snippets:

  • Section 13 - Copy
Placeholder Image

Lorem Ipsum

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere.

CTA

Copy and Grid - Section 14

Suggested Use: Feature Highlights, Key Benefits, Services, Resources - Two-Column Layout

Notes: This section uses a two-column layout. The left column contains a block heading, supporting copy, and CTA. The right column contains four content items arranged in a two-column grid. Each content item includes a sub heading, supporting copy, and a label/link with an arrow. The colored vertical bars are used to visually distinguish each content item.

Available Code Snippets:

  • Section 14 - Copy
  • Section 14 - Grid

Block Heading

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae.

CTA

Sub Heading

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Label

Sub Heading

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Label

Sub Heading

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Label

Sub Heading

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Label

Testimonials - (Section 15a)

Suggested Use: Employee Testimonials, Customer Quotes, Success Stories, or Other Featured Quotes

Notes: This section is available in three variants with different visual treatments. Each variant is designed to display a featured quote along with the testimonial author's name and title. The testimonial content, author name, and title can be updated as required. Select the appropriate variant based on the desired visual style.

Available Code Snippets:

  • Section 15 - Copy
Placeholder Image

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere Quisque.

First Last Title Goes Here

Testimonials - (Section 15b)

Suggested Use: Employee Testimonials, Customer Quotes, Success Stories, or Other Featured Quotes

Notes: This section is available in three variants with different visual treatments. Each variant is designed to display a featured quote along with the testimonial author's name and title. The testimonial content, author name, and title can be updated as required. Select the appropriate variant based on the desired visual style.

Available Code Snippets:

  • Section 15 - Copy
Placeholder Image

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere Quisque.

First Last Title Goes Here

Testimonials - (Section 15c)

Suggested Use: Employee Testimonials, Customer Quotes, Success Stories, or Other Featured Quotes

Notes: This section is available in three variants with different visual treatments. Each variant is designed to display a featured quote along with the testimonial author's name and title. The testimonial content, author name, and title can be updated as required. Select the appropriate variant based on the desired visual style.

Available Code Snippets:

  • Section 15 - Copy
Placeholder Image

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere Quisque.

First Last Title Goes Here

Dynamic Related Content W Heading - (Section 16a)

Suggested Use: 3 related content links with Heading

Notes: Use this section template when you want to handpick pages to be featured as related content.

Available Code Snippets: N/A

Dynamic Related Content without Heading - (Section 16b)

Suggested Use: 3 related content links without Heading

Notes: Use this section template when you want to handpick pages to be featured as related content.

Available Code Snippets: N/A

2 Column Copy w CTA - Section 17a

Suggested Use: Feature Content, Services, Resources, or Supporting Information - Two Column Layout

Notes: This section uses a two-column layout. Each column contains a heading, supporting copy, and CTA. The content in both columns can be updated independently.

Available Code Snippets:

  • Section 17 - Copy W CTA

Lorem ipsum dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

CTA

Lorem ipsum dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

CTA

3 Column Copy without CTA - Section 17b

Suggested Use: Feature Content, Services, Resources, or Supporting Information - Three Column Layout

Notes: This section uses a three-column layout. Each column contains a heading and supporting copy. The content in each column can be updated independently. This variant does not include a CTA.

Available Code Snippets:

  • Section 17 - Copy without CTA

Lorem ipsum dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

Lorem ipsum dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

Lorem ipsum dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere. Curabitur sed lorem eu tortor convallis eleifend a eu ipsum. Morbi tempor, libero ac fringilla dignissim, ligbortis urna, commodo vehicula dolor libero vestibulum ipsum.

3 Horizontal with CTA - Section 18a

Suggested Use: Feature Content, Services, Resources, or Promotional Content - Three Column Layout

Notes: This section uses a three-column layout. Each column contains an image, heading, supporting copy, and CTA. The content in each column can be updated independently.

Available Code Snippets:

  • [code snippet name]: Section 18a - 3 Column Content with CTA
  • placeholder image

    Header Lorem Ipsum

    Lorem ipsum dolor sit amet, consec tetur adipiscing ut enim ad minim veniam, quis nostrud

    CTA

  • placeholder image

    Header Lorem Ipsum

    Lorem ipsum dolor sit amet, consec tetur adipiscing ut enim ad minim veniam, quis nostrud

    CTA

  • placeholder image

    Header Lorem Ipsum

    Lorem ipsum dolor sit amet, consec tetur adipiscing ut enim ad minim veniam, quis nostrud

    CTA

2 Horizontal with CTA - Section 18b

Suggested Use: Feature Content, Services, Resources, or Promotional Content - Two Column Layout

Notes: This section uses a two-column layout. Each column contains an image, heading, supporting copy, and CTA. The larger two-column layout provides more space for each image and its associated content. The content in each column can be updated independently.

Available Code Snippets:

  • [code snippet name]: Section 18b - 2 Column Content with CTA
  • placeholder image

    Header Lorem Ipsum

    Lorem ipsum dolor sit amet, consec tetur adipiscing ut enim ad minim veniam, quis nostrud

    CTA

  • placeholder image

    Header Lorem Ipsum

    Lorem ipsum dolor sit amet, consec tetur adipiscing ut enim ad minim veniam, quis nostrud

    CTA

Benefits - (Section 19)

Suggested Use: Benefits, Key Features, Employee Perks, Services, or Other Highlighted Information

Notes: Use this section to display a heading and supporting description followed by a grid of benefit or feature items. Each item can include an icon and a title. The section also includes a CTA below the grid for directing users to additional information. Icons, titles, supporting content, and CTA text can be updated as required.

Available Code Snippets:

  • Section 19 - Benefits

Lorem Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

  • placeholder image

    Lorem Ipsum dolor sit amet

  • placeholder image

    Lorem Ipsum dolor sit amet

  • placeholder image

    Lorem Ipsum dolor sit amet

  • placeholder image

    Lorem Ipsum dolor sit amet

  • placeholder image

    Lorem Ipsum dolor sit amet

  • placeholder image

    Lorem Ipsum dolor sit amet

Dark Gradient Image and Copy - (Section 24)

Suggested Use: Feature Content, Page Introductions, Services, or Promotional Content - Image Left, Copy Right

Notes: This section uses a two-column layout with an image on the left and a heading with supporting copy on the right. The section uses a predefined gradient background that cannot be customized. Recommended image size is 590 × 358 pixels. The image can be updated from the Media module, while the heading and supporting copy can be updated from the Custom HTML module.

Available Code Snippets:

  • Section 24 - Copy
Placeholder Image

Lorem Ipsum Dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere.

Dark Gradient Card w Image - (Section 25a)

Suggested Use: Benefits, Features, Services, Resources, or Other Highlighted Content - Four Column Card Layout

Notes: This section uses a four-column card layout with a heading and supporting description at the top. Each card contains an image, card heading, and supporting copy. Recommended image size is 237 × 150 pixels. The image can be updated from the Media module, while the heading, card content, and supporting description can be updated from the Custom HTML module. The card background uses a predefined gradient and cannot be customized.

Available Code Snippets:

  • Section 25 - Intro
  • Section 25 - Cards

Lorem Ipsum Dolor

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus.

Placeholder Image

Card heading

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.

Placeholder Image

Card heading

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.

Placeholder Image

Card heading

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.

Placeholder Image

Card heading

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.

Copy w Icon - (Section 26)

Suggested Use: Benefits, Key Features, Employee Perks, Services, or Other Detailed Information - Two Column Layout

Notes: This section uses a two-column layout. Each column contains an icon, benefit heading, descriptive copy, a specific benefit subheading, and a list of benefit details. Each column can be updated independently. Icons can be updated from the Media module, while the headings, copy, and benefit details can be updated from the Custom HTML module.

Available Code Snippets:

  • Section 26 - Content
Placeholder Image

Name of benefit

Descriptive copy goes here

Specific benefit

  • Details of benefit
  • Details of benefit
  • Details of benefit
Placeholder Image

Name of benefit

Descriptive copy goes here

Specific benefit

  • Details of benefit
  • Details of benefit
  • Details of benefit

Full width Image - (Section 27a)

Suggested Use: Featured Images, Promotional Content, or Supporting Page Content - Single Image

Notes: This variant displays a single large image. Recommended image size is 997 × 499 pixels.

Available Code Snippets: N/A

Placeholder Image

2 - Side by Side Image - (Section 27b)

Suggested Use: Featured Images, Promotional Content, or Supporting Page Content - Two Images

Notes: This variant displays two images side by side. Recommended image size is 590 × 358 pixels per image.

Available Code Snippets: N/A

Placeholder Image
Placeholder Image

3 - Side by Side Image - (Section 27c)

Suggested Use: Featured Images, Promotional Content, or Supporting Page Content - Three Images

Notes: This variant displays three images side by side. Recommended image size is 387 × 236 pixels per image.

Available Code Snippets: N/A

Placeholder Image
Placeholder Image
Placeholder Image

Multi Item - (Section 28a)

Suggested Use: Content Pages

Notes: Use the "Section 28 - Copy" and "Section 28 - Item" modules to make modifications.

Available Code Snippets:

  • Section 28 - Copy: Use to reset any "Section 28 - Copy" module.
  • Section 28 - Item: Use to reset any "Section 28 - Item [number]" module.

Lorem Ipsum

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae.

Lorem ipsum dolor sit amet ut enim ad minim?

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere.

Lorem ipsum dolor sit amet ut enim ad minim?

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere.

Lorem ipsum dolor sit amet ut enim ad minim?

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Praesent ac nulla iaculis, ornare magna quis, posuere ex. Quisque pulvinar feugiat sem in ultrices. Pellentesque ut volutpat nunc. Duis suscipit orci finibus libero bibendum, eget ornare mauris posuere.

Map - (Section 29a)

Suggested Use: A Google Maps interface showcasing a list of one or more locations/addresses, with introductory copy above (optional.)

Notes: It is not possible to customize styling of the "map" or its components. Only the actual locations/addresses are customizable.

Available Code Snippets:

  • v1 - Section 29 - Copy: Use to "reset" any "Section 29 - Copy" module.

Lorem Ipsum

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Nullam id vestibulum lectus.

  • Nullam id vestibulum lectus. 
  • Nullam id vestibulum lectus. 
  • Nullam id vestibulum lectus. 
  • Nullam id vestibulum lectus. 
  • Nullam id vestibulum lectus. 

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae.

Image and Copy - (Section 29b)

Suggested Use: Use as standalone image alongside copy

Notes:

Available Code Snippets: See Section 29a

Lorem Ipsum

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae. Fusce est ligula, tincidunt eget cursus vel, faucibus eget sem. Donec a mattis lectus. Nullam id vestibulum lectus.

  • Nullam id vestibulum lectus. 
  • Nullam id vestibulum lectus. 
  • Nullam id vestibulum lectus. 
  • Nullam id vestibulum lectus. 
  • Nullam id vestibulum lectus. 

Nullam id vestibulum lectus. Curabitur commodo posuere sapien, non vulputate lorem dapibus vitae.

Google API Job Map - (Section 30a)

Suggested Use: N/A

Notes: N/A

Available Code Snippets: N/A

Search by Map

Loading location search.

Talent Community CTA - Section 31

Suggested Use: For Talent Community CTA

Notes: N/A

Available Code Snippets:

  • Section 31 - Talent Community CTA:

Lorem ipsum dolor sit amet, consectetur

Lorem ipsum dolor

CCHCS Talent Community Form - CRM Form - (Section 32a)