The photo home feature block allows you to showcase a striking photo alongside the main message of your site. It is designed for homepage use and should not be used on child pages.
The sidebar navigation that comes with child pages compresses the photo home feature block. The spacing between elements becomes cumbersome along the left and right side and takes away from the desired impact of the site’s message.
There are four components of the block, which all together comprise a slide:
- The image
- Photo heading
- Photo caption (optional)
- Color selection
You can add up to five slides on the backend, each with their own photo, caption and heading. The color should be kept consistent across all the slides and should match your site’s accent color as specified in the site build.
The site will randomly display one of the slides upon arrival or refresh. You can use the same image in multiple slides if you just want different headings; or you can use the same heading in multiple slides if you wish just the image to change upon refresh.
How to edit the photo heading
Once in the Page Editor, click anywhere in the hero text area to edit. To add/remove underlines in the hero text block, highlight the text and press CTRL+U.
Note that bold text cannot be used in this area.
How to pick a new image
Once in the Page Editor, click the small pencil icon in the top left corner of the image. You’ll be taken to the Media Library where you can either upload a new image or choose one from the library.
The minimum image size is 1280×720 pixels.
The photo heading container appears in the bottom right of the block and covers the bottom right portion of the image. You should choose an image where the focus is in the center or left of the image.
How to edit the photo caption
The caption is optional.
To edit the caption below the image, click on the text called that reads Photo Caption.
If those fields are left blank, no call to action will appear in this block.
How to edit the accent color
The editor bar to the right of the Page Editor is where you can select the accent color. Make sure that “Block” is selected at the top of that bar. Then you’ll see the color options in small circles. Click on the one you need.