Hero Image

COMPONENT TRAINING VIDEOS

A video demonstration of each of the components and how to use them is provided for web editors. Increase your confidence using the components by reviewing these training videos. 

Component Example: 001 C1 V1

This allows you to add an image to the banner behind the title.

Component Example: 001 C1 V2

This is another version of the hero component, and can be used if you have a paragraph of text you want to display in the hero/banner area of the page. You can also add CTA buttons as seen below:

Component Example: 001 C1 V3

Very similar to component 001 C1 V1 but is smaller. It applies an image to the banner behind the title.

Component Example: 002 C2

The WYSIWYG component is for paragraphs of text when text formatting is required. It supports bold, italic, and underlined content as well as links, lists and text alignment options. It works similar to other text formatting applications. WYSIWYG stands for "What You See Is What You Get".

Component Example: 003 C3

The feature thumbnail list component is good for presenting content in a visually driven, easily scannable way. The user can click on the image or the text to see more.

Component Example: 004 C4

This component is for situations where a lot of text content is required on a page. It splits the page between images and text to make the content more visually interesting while allowing a lot of space to write text at length.

COMPONENT EXAMPLE: 005 C5 VIMEO

This component facilitates easily adding a Vimeo video embed and ships with a nice title and description area as well as an optional call to action button.

Component Example: 005 C5 YouTube

This component facilitates easily adding a YouTube video embed and ships with a nice title and description area as well as an optional call to action button.

Component Example: 006 C6

Use the contact section to add departmental names, phone numbers, email addresses and hours of availability.

Component Example: 007 C7

Feature key options or links using this grid of custom icons.

Component Example: 008 C8

The feature list component allows the user to emphasize a list of items. The items can't be hyperlinked, so the component is just for ticking through a list of items to be featured.

Component Example: 009 C9 (No Images)

Display content to support the words of the content. The editor can choose to display 3 or 4 cards across on desktop view.

Component Example: 009 C9 (Images)

Display content with engaging images to support the words of the content. The editor can choose to display 3 or 4 cards across on desktop view.

Component Example: 010 C10

An image gallery with optional captions.

Component Example: 011 C11 V1

The call to action component is used to give the user the opportunity to respond to the content on the page by taking the next step in the process, whether that be to apply for something, schedule a meeting, or learn more information.

Component Example: 011 C11 V2

The call to action component is used to give the user the opportunity to respond to the content on the page by taking the next step in the process, whether that be to apply for something, schedule a meeting, or learn more information. With this one, you have the option to add a nice image.

Component Example: 011 C11 V3

The call to action component is used to give the user the opportunity to respond to the content on the page by taking the next step in the process, whether that be to apply for something, schedule a meeting, or learn more information. This option is a lot smaller, takes little space.

Component Example: 011 C11 V4

The call to action component is used to give the user the opportunity to respond to the content on the page by taking the next step in the process, whether that be to apply for something, schedule a meeting, or learn more information.

Component Example: 013 C13

The social follow component allows you to display links to your social media accounts. The component can have a brand evergreen or brand lime background.

Component Example: 014 C14

This component is great for giving the visitor options as it displays multiple (3+) links in one place. You can choose to have the links open in a new tab.

Component Example: 015 C15

This component is for when you have a group of links to display and you need a small image to accompany each link.

Component Example: 016 C16

A component for displaying information in a decorative way with engaging images.

Component Example: 017 C17

Animates the counting of a number to display.

Component Example: 018 C18

Resource Cards provide a great way to represent key features with an image and an inviting graphical link.

Component Example: 019 C19

This is a great component for featuring your staff and a bio about them.

Component Example: 020 C20

This component is great for frequently asked questions, but can be used anytime you want to make it easier to sort through large sections of text.

Component Example: 021 C21

This component allows the user to create sections of content with relevant images, and the text nicely floats around the images.

Component Example: 022 C22

This component is for notifying your visitors of some urgent or unusual change that may affect availability, offerings, or resources.

Component Example: 023 C23

This component is for disclaimers and for notifying users about information they may need to know but that is not central to the message of the page.

Component Example: 024 C24

This component is for featuring bios when there are a lot of individuals to feature on one page.

COMPONENT EXAMPLE: 025 C25

This component is for inserting a small image that includes a title and small description. The minimized size allows more space within the page.

COMPONENT EXAMPLE: 026 C26

This component features an image in a larger format and also allows a link, title, and a description.

COMPONENT EXAMPLE: 027 C27

This component features large thumbnail image and a title. The entire card is a link.

Component Example: 028 C28

Used to display upcoming events by date.

Component Example: 029 C29

Event Information

Component Tip: 1

This allows you to learn how to add documents onto your file.

Component Tip: 2

This video shows how you can add or move components within your page.

Component Tip: 3

This video show how to add photos and edit the photo information.

Component Tip: 4

This video shows how to fix certain issues you might run into when editing your page.

COMPONENT TIP: 5

This video shows how to add, remove, or edit within the side navigation.