A hero block works well for top-level pages. It is reserved for website home pages and marketing landing pages. When placed on the page, this component provides a form where you may add a full-width image or video at the top of your webpage. You may also choose to add three call-to-action links under it.

Image Placeholder

Step-by-Step Guide

To add your hero block component


Image Placeholder

  1. Find the predefined area where your hero component should be placed. There will be a green box called Hero Component.
  2. Click on Hero Component to open the editable region. 
  3. Place cursor in the editable region. 
  4. Click on Components on the toolbar.
  5. Click on Hero Block With Optional Call to Action (CTA). 
  6. Click Insert. 

This form will accept a video or an image. If you choose to upload a video, you will need to include an image as well.

Choosing a video

  • Video files accepted: MP4, WebM or Ogg.

Choosing a hero image 

  • When choosing a hero image, consider that the image will size in relation to the browser. Choose a photo in which the most visible element is centrally located within the hero block.
  • A good size for this photo is 1920 x 1080px. 
  • You may choose to insert a photo alone or choose to insert a photo with a video. 

To insert a photo:

  1. Click on the file chooser tool Image Placeholder.  
  2. Navigate to your _Files folder.  
  3. If your image is already within that folder, click on it and select Insert
  4. If your image needs to be uploaded to that folder, click on Upload.
  5. Either +Add the file or drag the file from your desktop
  6. Click Start Upload.  
  7. Click Insert once upload is complete.

To insert a video:  

You are provided with three video format choices: one for MP4; one for WebM; and one for Ogg.

  1. Click on the file chooser button. 
  2. Navigate to your _Files folder.  
  3. If your video file is already within that folder, click on it and select Insert. 
  4. If your video file needs to be uploaded to that folder, click on Upload.  
  5. Either +Add the file or drag the file from your desktop.  
  6. Click Start Upload.  
  7. Click Insert once upload is complete.

Adding a call to action

Your call to action section is optional. You may include

  • An eyebrow
  • A headline
  • A description

You may add up to a maximum of three button links (CTA). Click Save.