The 'Banner' block is typically placed at the top of a page. Its purpose is to grab the attention of a page viewer. It displays a title, excerpt, and link text over a background image. Make sure to select a high quality image that directly relates to the content of that page. The link text should be descriptive and signify where the user will be directed upon clicking the link.
Provide a descriptive headline for the banner block.
You have the ability to select the heading level of the title. Heading 2 is set by default, but may need to be adjusted depending on where you nest the banner block within the page.
The 'Excerpt' field is optional. The default Banner block displays the excerpt text directly below the 'Title' field. It should be descriptive and directly relate the Banner block to the page.
The 'Link' field is optional. This field gives you the option of adding a button with a clickable link below the banner 'title' and 'excerpt'.
In the 'URL' sub-field, enter a link to a website or internal URL.
In the 'Link text' sub-field, enter what the button should display on the page.
In the 'Background' sub-field, there are many options to customize the banner block.
Image or Video: You have the option to display an image or a short looping video for the banner block background.
NOTE: Image Specifications documentation.
NOTE: Videos must be in .mp4 format and under 10 MB. Background videos are meant to be decorative and not a source of information.
Selecting a video will also offer an autoplay option. Keep in mind enabling autoplay can trigger vestibular disorders. Users can control the autoplay by changing their computer to "reduce motion" or by pausing the video which remembers their preference with a browser cookie.
A placeholder image will be generated by the first few frames of the video.
Background color options: Black, White, Brain Pattern, Brain Pattern Black, Brain Pattern Reversed, Gray and Gold.
The 'Display Options' field offers customizability to the banner block.
Content position: Select which position the banner will be aligned to.
- Left aligned and centered vertically: The content will be centered on the left side of the block
- Left aligned horizontally and bottom-aligned vertically: The content will display on the left side at the bottom of the block
- Centered horizontally and vertically: The content will display in the center of the block
- Centered horizontally and bottom aligned vertically: The content will be centered at the bottom of the block
Height: Select how tall the banner will display on a page.
Gradient: Select a dark or light theme for the banner gradient.
Headline options: Select a font style for the banner block title.
The Banner Block is available in the following section layouts:
- One column
- Two column
- Three column
- Four column
- Page w/ left sidebar