How to update hero sections

Edited

A Hero is typically the first image that guests land on when they go to that page. Hero sections appear at the top of a page and typically contain optional imagery, text and a button.

Note: Depending on your website's theme, this can also be known as "header" or "landing content".

To edit the hero section of one of your pages, follow the steps below.

  • Log in to the backend and click on Pages in the left hand sidebar.

  • Hover over the page for which you’d like to edit the hero section. Click the edit icon that appears.

    Image_2019-04-07_at_9.42.16_PM.png

  • On the Edit page, click on the content box labeled “Header.”

    Image_2019-04-07_at_9.44.35_PM.png

    On the “Edit Header” page, you can edit the following elements:

  • Title: this is the headline that displays to visitors. Headlines are typically a larger font size.

  • Text: this text will appear just below the headline.

  • Background Type: this sets what appears behind the title and text. Select one of the following from the dropdown.

    • None: displays the default background of the website.

    • Color: display a solid color background.

    • Images: display one or more images as the background.

    • Instagram: display a gallery featuring the ten latest photos posted in your Instagram feed. To use this feature, connect your Instagram account in social settings.

    • Youtube: display a Youtube video as the background. Select this option and paste the Youtube video’s ID in the “Youtube Video Id” field. To get the video’s ID, just copy the 11-character portion of the video’s URL following the “watch?v=”. Note that your video will play without sound.

    • Vimeo: display a Vimeo video as the background. Select this option and paste the Vimeo video’s ID in the “Youtube Video Id” field. To get the video’s ID, just copy the 9-digit number at the end of the video’s URL. Note that your video will play without sound.

  • Darken: this checkbox will appear if you choose the Images, Instagram, Youtube or Vimeo options from the background dropdown. If you check the box, the background will appear darker so that text is easier to read.

Click the “Save” button. Now if you click the “Visit Website” link at the top of the screen, you will be able to view your changes.

Was this article helpful?

Sorry about that! Care to tell us more?

Thanks for the feedback!

There was an issue submitting your feedback
Please check your connection and try again.