Hero Image Options

The Hero Section is a prominent and consistent design element that appears across most page types, offering flexibility to enhance your site's visual appeal and usability.

(note this is sped up 30% but if you'd like the original that's here on Loom)

Adding Images or Videos

• Images: Upload a selected image — the system automatically optimises for different sizes and devices. Adding multiple images automatically generates a carousel with navigation dots.
• Videos: Input a YouTube or Vimeo link. Optionally upload a poster image to ensure a smooth visual transition while the video loads.

Hero Content Panels

Panels provide an accessible alternative to embedding text within images, supporting screen readers. Hero Content Panels can include titles, subtitles, and call-to-action buttons with links.

• Panels only appear if the Full Screen option is enabled.
• Adjust panel positioning (e.g. centre or bottom alignment) for visibility on mobile and desktop.
• Apply light or dark overlay themes to improve text readability.

Signpost Bar

Add Signposts for clear shortcuts to important sections. Include icons, links, and subtext. Limit to 5 signposts maximum to avoid clutter.

Transparent Header

For a more immersive page (e.g. seasonal event or themed experience), enable the Transparent Header option found on the Page Settings tab. Ensure background images are dark enough to maintain menu contrast.

Mobile Overrides and New Crop Options

Mobile Image Override: Upload a separate mobile-specific image to avoid awkward crops. Ideal for images with important content near the edges — use portrait/square for mobile and landscape for desktop.

Uncropped Hero Image Option: A new "uncropped" mode reduces the amount of auto-cropping across screen sizes — great for showcasing full artwork or visuals with detail across the whole frame.

Created by Neil Lewin, Modified on Mon, 9 Mar at 9:37 PM by Neil Lewin