Header Background

Header Image

The "Header Image" field populates a static image in the header spot.  If a header background 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 696px tall.  If the "header text" field is used for the page the image size may need to increase in height and will depend on how much content you place in that field.  

"Header Text" and "Header Class" Fields

The field "Header Text" adds content overtop of your static header image or background video. This works the same as the page content field, so you can include text, buttons, etc. The text will display centered as the default.

The field "Header Class" allows you to manually add a class to change the header/billboard options. If more than one class is used, you must include a space in between the classes.  Lowercase is required.

  • overlay - adds a dark overlay to your header image or video
  • large - changes to a larger header image and the size requirements will increase to 2,732px wide by 1,564px tall
  • right - moves the header text box to the right
  • left - moves the header text box to the left

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.

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 will override the static image/video settings and display images will display as slides. Within each rotator item, the title, caption, link and button text fields are optional. If used, they will display in a box overtop of the respective image.

The rotator has similar options available as the "Header Class" field, but checkboxes are used and set within each rotator:

  • Large checkbox - this is set for an entire rotator (under the "details" tab) and will increase the image size requirements to 2,732px wide by 1,564px tall.

The following three options are set per slide:

  • Slide Overlay checkbox - will allow you to assign the dark overlay option to specific rotator slides
  • Caption Right checkbox - moves the header text box to the right
  • Caption Left checkbox - moves the header text box to the left