Collection banner
The heading of a collection page, with a label and a text, taken from the collection or written here.
munich-demo.myshopify.com
What it does
A label, the collection title (or your own heading) and a short text at the top of the collection page, left aligned or centered. It reads the collection unless you overwrite the heading, so the same template works for all collections.
When to use it
At the top of the collection template, under the breadcrumbs. Every collection page needs a heading; this is it.
Setting it up
- Write a Label such as Shop, or clear it.
- Leave Heading empty, or write one for a template used by a single collection.
- Write one line of Text and choose Alignment.
Settings
| Setting | Type | What it does |
|---|---|---|
| General | ||
| Color scheme | Color scheme | The surface of the section: background, text, buttons and accent as one contrast-checked set. Schemes are edited under Theme settings, Colors. |
| Width | Select | Fixed width keeps the section inside the page margin so it lines up with the sections around it. Full width runs it to the edge of the screen.Options: Fixed width, Full width · Default: Fixed width |
| Header | ||
| Label | Text | A small kicker above the title, such as Shop.Default: SHOP |
| Heading | Text | Your own heading. Empty shows the collection's own title, so one template serves every collection. |
| Text | Rich text | One line under the title. |
| Size | Select | How large the heading renders, on the shared type scale from Theme settings, Typography.Options: Large, Medium, Small, Extra small · Default: Large |
| Accent font | Select | Highlight words puts the italicized words on the accent font. Whole heading sets the entire line in it. Off keeps the heading font.Options: Highlight words, Whole heading, Off · Default: Off |
| Alignment | Select | Whether the banner text sits at the left margin or is centered.Options: Left, Center · Default: Center |
| Section padding | ||
| Top padding | Range | Space between the top of the section and its content. On a phone the theme tightens it by a quarter.0 to 120 px · Default: 40 |
| Bottom padding | Range | Space between the content and the bottom of the section. On a phone the theme tightens it by a quarter.0 to 120 px · Default: 16 |
Tips
- Leave Heading empty and the banner shows the collection's own title, so one template serves every collection.
- The collection's description belongs in the Collection text section under the grid, where it helps search engines without pushing products down. Use the banner's Text for one line.
- The demo turns the accent font off here. A collection title is a name, not a statement.