Header Background

Overview

For the header area, you have three options available: static image, muted/looping background video or image rotator.

These four additional fields in the pages module are available for use in the header area: 

  • Header Overlay - will add a dark overlay on the header image. This is helpful if you're displaying text overtop of the image. 
  • Header Text - can be used to add text over top of a header image or background video. This field works the same as the content editor, so you can add header text, links, buttons, etc.
  • Hide Page Title - will remove the page title/description
  • Header Fixed - Displays the header over the billboard area.

Static Image

The page "Header Image" field populates the header background image.  If a header video is present, this image will be the preview image while the video is loading and also serves as the fallback for devices that do not support video.

Images should be 2,732px wide by 1,000px tall  If the "Header Fixed" option is used the image height should increase to 1,400px tall. 

NOTE - If a looping video is used the height is increased to 600px tall.

Background Video

Using the field "Header Background Video (mp4/h264)" will replace the background image with a background video.  The video must be MP4/H264 formatted video and should have a ratio of 16:9.

If a header video is loaded in, the "header image" field will show as the preview image while the video is loading and also serves as the fallback for devices that do not support video.

NOTE - This is a looping/muted background video so the video should be kept short in size/length (under 30 seconds).

Rotator

If a rotator is assigned to a page, the images will display as slides.  The title and caption are optional and will display as an overlay.  The button uses the Button Text field and works with the slide link/url.

NOTE - There is a "Slide Overlay" checkbox that will allow you to assign the dark overlay option to specific rotator slides.