Blog
The blog index. A masthead, an optional row of topic filters, then a grid of article cards with numbered pagination.
Section settings
Section titled “Section settings”| Setting | Type | Default | What it does |
|---|---|---|---|
| Eyebrow | Text | Dispatch | Small accent line above the blog title |
| Columns | Range 2–4 | 3 | Columns on desktop |
| Products per page | Range 3–24, step 3 | 9 | Articles per page |
| Show an excerpt | Checkbox | true | Show 130 characters of the excerpt (or the content, when there is no excerpt) |
| Show topic filters | Checkbox | true | Show topic filters. Lists every tag used in this blog — only appears when articles are tagged |
| Image focal point | Select | center | Which part of each image stays in frame when it is cropped: top · upper · center · lower · bottom |
Topic filters
Section titled “Topic filters”With show_tags on and blog.all_tags non-empty, a row of links renders: All first, then one per tag, pointing at /<blog>/tagged/<tag>.
The currently viewed tag is marked .on with aria-current="page" and links back to the bare blog, so tapping an active topic clears it. When a tag is active, the masthead also states Tagged: <tags>.
The cards
Section titled “The cards”Each card is the whole link: image plate, then a meta line of the abbreviated publish date plus the article’s first tag, then the title in display type, then the optional excerpt.
Images are served responsive at 320–1000w (33vw desktop, 100vw mobile), lazily, with alt text from the image’s own alt or the article title. Cards reveal as they scroll in, honouring reduced motion and the global Motion setting.
When the blog has no articles at all, a single empty-state line is shown.