Brand Story
Tabbed highlights
Section handle:
tabbed-highlights
Settings
| Setting | Type | Default | Description |
|---|---|---|---|
| Eyebrow | Text | Highlights | — |
| Heading | Text | What sets us apart | — |
| Supporting text | Rich text | <p>Share the details that make your products worth choosing.</p> | — |
| Accessible label | Text | Highlights | Names the list of highlights for screen readers. Not shown on the page. |
| Code prefix | Text | — | Word shown before each highlight's code and in the counter, for example Step. Blank shows the code alone. |
Blocks
Highlight
Block type:
proof
| Setting | Type | Default | Description |
|---|---|---|---|
| Code | Text | — | Short code shown above the label and on this highlight's tab, for example 01. Blank numbers the tabs in order. |
| Label | Text | Highlight | Small text shown above the title and on this highlight's tab. |
| Title | Text | Add a short title | Required, along with Statement. Highlights missing either are hidden, and the section is hidden when none are complete. |
| Statement | Multi-line text | Describe a detail that matters to your customers. | Required, along with Title. The main statement for this highlight. |
| Source | Text | — | Where the claim comes from, for example a test method. Shown under the statement. |
| Image | Image | — | Blank shows a placeholder until you choose an image. |
| Mobile image | Image | — | Shown on screens narrower than 768px. Blank uses the main image. |
| Image alt text | Text | — | Describes the image for screen readers. Blank uses the image's own alt text. |
| Caption | Text | — | Short text shown with the image. Hidden when this highlight has no image. |
Default Configuration
When you add this section from the Theme Editor, it comes pre-configured with:
- Tabbed highlights — 3× Highlight