Split hero
A full-width hero banner with an image or video on one side and text content on the other. Not available in the header, drawers, or popups.
- Video — an optional video shown instead of the image, when set.
- Image — the image shown for the media side (used when no video is set).
- Aspect ratio (mobile) — the shape of the media panel on mobile: 1:1, 4:5, 3:4, 2:3, 4:3, 16:9, or 9:16. Default 1:1.
Layout
Section titled “Layout”- Height — how tall the section is: Full (fills the screen), Small (20rem), Medium (30rem), Large (40rem), or X-large (50rem). Default Full.
- Width — how wide the media panel is: Small, Medium, or Large. Default Medium.
Content
Section titled “Content”- Color scheme (content) — the color scheme applied to the text content. Default Scheme 1.
- Order — whether the media or the text content appears first. Image first or Content first. Default Image first.
- Horizontal alignment — Left, Center, or Right alignment of the text content. Default Left.
- Vertical alignment — Top, Middle, or Bottom alignment of the text content. Default Middle.
- Max width — caps how wide the text content area can grow: Medium, Large, X-large, 2X-large, 3X-large, 4X-large, 5X-large, or None. Default 2X-large.
Section settings
Section titled “Section settings”- Color scheme — the overall section color scheme. Default Scheme 1.
- Spacing — where padding is applied: Bottom, Top, Top and bottom, or None. Default Top and bottom.
- Spacing size — how much padding: Base, Small, or X-small. Default Base.
- Include header offset — offsets the section by the height of the header, in addition to the top padding. Default off.
Blocks
Section titled “Blocks”- Heading, Subheading, Rich text, Button, Countdown — see Shared content blocks.
- Also supports app blocks.