Where to find it
In Online Store → Themes, open the unpublished theme editor, choose a compatible template, then Add section → Brand story. Availability follows the selected template and section group.
This section is not available in the Header group.
Set it up
- Set the section Heading and Text, then choose Alternating, Layered story, Editorial story or Timeline.
- Add a Story chapter for each part of the narrative. Select Story type and enter Label and Year or date when useful.
- Choose each chapter's image or video source, ratio and media position. Add its Heading, Rich text and other content as child blocks.
- Use supporting images selectively and adjust Media width, Gap between chapters and Media and content gap.
- Review the chapter order and its mobile presentation; a chapter's Content order controls which part appears first.
Main settings to review
| Setting | Choices or control |
|---|---|
| Layout | Alternating · Layered story · Editorial story · Timeline |
| Media width | 35–65 %; step 5 |
| Gap between chapters | 8–120 px; step 4 |
| Media and content gap | 0–80 px; step 4 |
| Mobile layout | Stack · Horizontal scroll |
Blocks and content
This section allows up to 12 direct blocks. Nested blocks have their own parent-specific choices and limits.
The following content blocks have their own setup and control reference. Nested blocks belong inside their parent, such as Slide, Tab, Tile or Story chapter.
Content and media
- Use a consistent crop within each group of chapters. A 1600 px image is a reasonable starting point for split layouts.
- For video chapters, choose the matching hosted-video or external-video source and provide a useful cover image.
Check the mobile layout
- Choose Stack or Horizontal scroll and review the order inside each chapter. Make sure dates, supporting images and chapter text still form a clear sequence.
Common questions and fixes
- A chapter shows media but no story text: add content inside the Story chapter block.
- Video is missing: check that Video source matches the actual video field you filled.
Full control reference
Names, choices, ranges and defaults below are read from this version of the theme. Defaults are starting examples, not promises about your business. Some controls appear only for the matching layout. Block contents and preset starting values can differ from the base defaults.
All section controls (28)
| Setting | Control or choices | Default and guidance |
|---|---|---|
| Width / Section width | Page width · Full width · Custom width | Default: Page width. |
| Width / Custom width | 50–100 %; step 5 | Default: 80. Percentage of screen width. This control appears only when the relevant layout or related option is selected. |
| Introduction / Text above heading | Text | Default: OUR STORY. |
| Introduction / Heading | Formatted inline text | Default: Made with purpose. |
| Introduction / Text | Formatted text | Default: Share the people, principles and milestones that continue to shape your brand.. |
| Introduction / Alignment | Left / Center / Right | Default: center. |
| Introduction / Content width | 40–100 %; step 5 | Default: 70. Percentage of the available section width on desktop. |
| Layout / Layout | Alternating · Layered story · Editorial story · Timeline | Default: Alternating. |
| Layout / Media width | 35–65 %; step 5 | Default: 50. |
| Layout / Gap between chapters | 8–120 px; step 4 | Default: 48. |
| Layout / Media and content gap | 0–80 px; step 4 | Default: 32. |
| Layout / Content padding | 0–80 px; step 4 | Default: 32. |
| Layout / Gap between content blocks | 0–48 px; step 2 | Default: 16. |
| Layout / Corner radius | 0–40 px; step 2 | Default: 12. |
| Mobile / Mobile layout | Stack · Horizontal scroll | Default: Stack. |
| Media / Section background image | Choose an image | Default: Not set. |
| Media / Section background position | Image focal point · Top · Center · Bottom | Default: Image focal point. This control appears only when the relevant layout or related option is selected. |
| Media / Section background behavior | Scroll with section · Fixed to viewport | Default: Scroll with section. This control appears only when the relevant layout or related option is selected. |
| Media / Section background overlay | 0–80 %; step 5 | Default: 0. This control appears only when the relevant layout or related option is selected. |
| Style / Color scheme | Choose a color scheme | Default: background. |
| Style / Top padding | 0–160 px; step 4 | Default: 64. |
| Style / Bottom padding | 0–160 px; step 4 | Default: 64. |
| Style / Mobile padding top | 0–120 px; step 4 | Default: 40. |
| Style / Mobile padding bottom | 0–120 px; step 4 | Default: 40. |
| Style / Custom CSS class | Text | Default: Not set. Enter class names only, without a period. |
| Advanced / Hide on desktop | On / Off | Default: Off. This control appears only when the relevant layout or related option is selected. |
| Advanced / Hide on mobile | On / Off | Default: Off. This control appears only when the relevant layout or related option is selected. |
| Advanced / Section anchor | Text | Default: Not set. Optional. Use a unique name for links that jump to this section. |