Shop the story
Where you can add it
Templates: Blog post.
Settings
Section titled “Settings”| Setting | Type | Default | Options and range |
|---|---|---|---|
| Eyebrow | Text | Shop the story | |
| Heading Make a word italic to emphasize it. | Inline rich text | Pieces from this story | |
| Heading size Shown when Heading is set. | Select | Large | |
| Highlight color Leave empty to use the page’s ground color on a tag color sheet, and the color scheme’s highlight otherwise. Shown when Heading is set. | Color | — | |
| Text | Rich text | Everything worn and mentioned above, in stock at the studio and online. | |
| Products Connect a product list metafield of the blog post to show each post’s own products. A post without products shows no section. | Products | — | up to 12 |
| Button collection Where the button leads. Connect a collection metafield of the blog post to link each post to its own collection. | Collection | — | |
| Link label Leave blank to use “Shop” and the collection’s title. Shown when Button collection is set. | Text | — | |
| Sheet | |||
| Sheet Tag color takes the color of the post’s first tag from Theme settings › Blog. | Select | Tag color | |
| Sheet color scheme Shown when Sheet is Color scheme. | Color scheme | Scheme 2 | |
| Text position Beside the products from 990 px. Smaller screens always show the text above them. | Select | Start | |
| Arrangement | |||
| Layout on desktop Each breakpoint is chosen separately, so a grid on desktop can be a carousel on a phone — or stay a grid. | Select | Grid | |
| Layout on tablet | Select | Carousel | |
| Layout on mobile | Select | Carousel | |
| Columns on desktop Shown when Layout on desktop is not Stack. | Range | 3 | 2–6, step 1 |
| Columns on tablet Shown when Layout on tablet is not Stack. | Range | 2 | 1–4, step 1 |
| Columns on mobile Shown when Layout on mobile is not Stack. | Select | 1 | |
| Space between products | Range | 20 px | 8–48 px, step 2 |
| Pagination Shown when Layout on desktop is Carousel or Layout on tablet is Carousel or Layout on mobile is Carousel. | Select | None | |
| Show arrows Shown when Layout on desktop is Carousel or Layout on tablet is Carousel or Layout on mobile is Carousel. | Checkbox | Off | |
| Text on glass Auto picks dark or light text for each glass element from the brightness of the photo behind it. Shown when Show arrows is on. | Select | Auto | |
| Product card | |||
| Image ratio | Select | Portrait | |
| Show the image gallery on hover On hover the card moves through the product’s images, as set in Theme settings › Product card › Image on hover. Touch screens show the first image. | Checkbox | On | |
| Show vendor | Checkbox | Off | |
| Show color swatches | Checkbox | On | |
| Show quick add | Checkbox | On | |
Settings every section has — Layout, spacing, motion and visibility — the same in every section. Not in this section: Section width. Defaults here: Top spacing 0 px (everywhere else: 64 px); Bottom spacing 148 px (everywhere else: 64 px); Top spacing on mobile 0 px (everywhere else: 40 px); Bottom spacing on mobile 96 px (everywhere else: 40 px); Stagger 110 ms (everywhere else: 0 ms). | |||
Presets
Section titled “Presets”- Shop the story — Category: Products
Starts with: empty