How to edit a homepage hero image

➤ Homepage Hero image

The "hero" is a special content block that is only available on your homepage. The hero allows you to create a high-impact visual introduction to your page with flexibility on look and feel.

The hero block consists of the below fields.

1. Heading 
2. Tagline - optional field 
3. Content alignment - left, right, centre
4. Show search - this is also optional and controls whether or not a search bar shows within the header image
5. Style - multiple style options may or may not be applicable to your theme
6. Layout - here you can choose your background image

During the Roam design phase, the Roam team will assist in the initial creation of the hero block. If at any time you would like to amend the hero block or add a different image, you can do so via the Homepage entry in your platform.

➤ Best practice for the Hero block: 

1. Choose your hero image carefully

Your image will be the first thing a user sees when they visit your destination’s site so you want to WOW them!

These images should be high resolution and eye-catching.  

2. Check your formatting
Make sure that the text isn't hiding the most visually interesting elements of the background image. Select right, centre, or left from the alignment dropdown to adjust where the text in your hero appears on the page.

Note: alignment will adjust all elements in the hero including the headline, tagline and search bar if enabled.

 3. Add a tagline

The tagline field gives you the opportunity to provide additional context to your hero image or the tagline of your brand.

The image below shows you a hero with a headline and tagline

  
4. Enable the interactive search bar
Having a search bar in the hero component of your homepage is a great way to get visitors engaged with your site.
If you want this feature turned off though you can slide the search toggle to off in the hero component.

The image below shows you a hero with a headline and tagline and the search functionality enabled.

Note: The text within the search bar is hardcoded into the site during our design phase. If you would like this changed at any time, please submit a support request with the new wording you would like to support@roamhq.io