Collection list page
Collection list page shows the collections on the Collection list template as a grid. You can show every collection or only the ones you add as blocks, and set how many appear per page.
How to add it
- In the Theme Editor, open the template where you want the section.
- Select Add section, then choose Collection list page.
The package uses this section on the Collection list template.
Settings
View the section guide .
Collection
| Setting | Options | Description |
|---|---|---|
| Collections to show | • All | All lists every collection in the store. Selected lists only the collections you add as Collection blocks. |
| Sort collections by | • Alphabetically, A-Z | Order of the collections in the list. It applies when Collections to show is All. |
When Collections to show is set to All, the section lists every collection in the store, sorted by the option you choose. When it is set to Selected, the section shows only the collections you add as blocks.
Collection card
| Setting | Options | Description |
|---|---|---|
| Image ratio | • Adapt to image | Shape of each collection image. Adapt to image keeps the image's own proportions. |
| Content position | • Overlay | Shows the collection name over the image (Overlay) or under it (Below image). Overlay uses the Text color setting. |
| Show product count | Shows the number of products in each collection under its name. | |
| Content alignment | • Left | Aligns the collection name and product count to the left or center of the card. |
Each card also shows the lowest price of the products in the collection. The section has no setting for it.
Layout
| Setting | Options | Description |
|---|---|---|
| Collections per page | Number of collections shown on one page. | |
| Columns on desktop | Number of collection cards per row on desktop. Phones always show two per row. | |
| Column gap | • No gap | Space between the collection cards: no gap, small, medium or large. |
Carousel
| Setting | Options | Description |
|---|---|---|
| Pagination type | • Default | How further collections load: numbered pages (Default), a Load more button, or automatically while the shopper scrolls (Infinite scroll). Numbered pages apply only when Collections to show is All. With Selected, use Load more button or Infinite scroll, since Default hides the collections past the first page. |
Appearance
| Setting | Options | Description |
|---|---|---|
| Text color | Color of the collection name and product count over the image. Shown only when Content position is Overlay. | |
| Color scheme | Edit color schemes in Theme settings. |
Section layout
| Setting | Options | Description |
|---|---|---|
| Section width | • Page width | Width of the section content: standard page width, a wider container, or the full screen width. |
| Top padding | Space above the section in pixels. | |
| Bottom padding | Space below the section in pixels. | |
| Show top border | Draws a thin line along the top edge of the section. |
Blocks
Collection (collection)
Adds a collection to show when Collections to show is set to Selected. Collection image replaces the collection's own image.
| Setting | Options | Description |
|---|---|---|
| Collection | Collection shown in this card. Used when Collections to show is Selected. | |
| Collection image | Leave blank to use the collection's image. |
Notes
Collections per page accepts values from 4 to 24.
No comments yet