Collection
Where you can add it
Not in the Add section list: it comes with its template or section group.
Blocks
Section titled “Blocks”- Promo tile — part of this section; up to 8
Promo tile
up to 8
| Setting | Type | Default | Options and range |
|---|---|---|---|
| Content | |||
| Tag | Text | The edit | |
| Heading | Text | Tailoring, softened | |
| Text | Multiline text | Unlined jackets and trousers that move like knitwear. | |
| Button label Shown when the tile has a link. The whole tile opens the link. | Text | Shop the edit | |
| Link | Link | — | |
| Media | |||
| Image | Image | — | |
| Mobile image | Image | — | |
| Image darkening Darkens the image so the text stays readable over it. | Range | 62 % | 0–90 %, step 2 |
| Text on glass Auto picks dark or light text for each glass element from the brightness of the photo behind it. | Select | Auto | |
| Color scheme The tile’s background and text when there is no image. | Color scheme | Scheme 8 | |
| Placement | |||
| Position in the grid Counts from the first product. A position past the last product puts the tile at the end. | Range | 5 | 1–48, step 1 |
| Width on desktop | Select | Two columns | |
| Width on mobile | Select | Full row | |
| Show on these collections Leave empty to show the tile on every collection. | Collections | — | |
| Show on every page Otherwise the tile shows on the first page only. | Checkbox | Off | |
Settings
Section titled “Settings”| Setting | Type | Default | Options and range |
|---|---|---|---|
| Products | |||
| Products per page | Range | 24 | 8–48, step 2 |
| Columns on desktop Narrow content holds four columns at most, so product cards keep a readable width. | Range | 4 | 2–6, step 1 |
| Columns on tablet | Range | 3 | 2–4, step 1 |
| Columns on mobile | Select | 2 | |
| Space between columns The widest the gaps get. They narrow with the screen, as in the design. | Range | 20 px | 8–48 px, step 2 |
| Space between rows | Range | 48 px | 16–96 px, step 4 |
| Show collection title Turn on when the page has no collection banner. The banner shows the title, description and count. | Checkbox | Off | |
| Show collection description Shown when Show collection title is on. | Checkbox | On | |
| Show product count Shown when Show collection title is on. | Checkbox | Off | |
| Toolbar | |||
| Sorting and the sticky toolbar are set in Theme settings › Filters and sorting. | |||
| Show product count | Checkbox | On | |
| Show grid density buttons Two buttons in the toolbar: larger images (one column fewer) or the columns set here. | Checkbox | On | |
| Panel color scheme The toolbar, the page arrows and the panel shown when no products match. | Color scheme | Scheme 2 | |
| Pagination | |||
| Style | Select | Load more button | |
| Load to the end Products keep loading until the last one, so customers may never reach the footer. Shown when Style is Infinite scroll. | Checkbox | Off | |
| Automatic loads Then a Load more button appears, so customers can reach the footer. Shown when Style is Infinite scroll and Load to the end is off. | Range | 3 | 1–10, step 1 |
| Product card | |||
| Image ratio | Select | Portrait | |
| Content alignment | Select | Start | |
| 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 Shows swatches for the first option that has them set up in your product settings, or sibling products when they are turned on in theme settings. | Checkbox | On | |
| Show add to cart Adds to cart from the card for products with a single variant. Products with options link to the product page instead. | Checkbox | On | |
Settings every section has — Layout, spacing, motion and visibility — the same in every section. Not in this section: Section width. Defaults here: Content alignment Center (everywhere else: Start); Top spacing 40 px (everywhere else: 64 px); Bottom spacing 144 px (everywhere else: 64 px); Top spacing on mobile 24 px (everywhere else: 40 px); Bottom spacing on mobile 96 px (everywhere else: 40 px); Stagger 90 ms (everywhere else: 0 ms). | |||