Hero block
The page-top showpiece — title, up to 3 buttons, and five image layouts to choose from.
What is the Hero block?
The Hero block is the page-top showpiece. It owns the top of the screen, sets the tone, and asks visitors to do something — read more, sign up, get in touch.
It offers five image layouts (imageStyle) and up to three buttons, plus rich text above and below the buttons. The image styles that aren't "none" require an image (a client-media ID); examples below use sample images from our placeholder bank.
Hover over any example for the "How to set this up" button.
imageStyle: "none"
Centred text-only hero. The fastest way to land a single, focused message.
imageStyle: "background"
Full-bleed background image with white text overlaid. Best for emotive photography.
imageStyle: "left"
Two-column split: image on the left, text on the right. Best for product shots and screenshots.
imageStyle: "right"
Mirror of imageStyle "left" — text on the left, image on the right.