Collection carousel
Collection carousel shows a set of collections as cards in a carousel. Each card uses the collection's image and title unless you replace them.
How to add it
- In the Theme Editor, open the template where you want the section.
- Select Add section, then choose Collection carousel.
The package uses this section on the Collection template.
Settings
View the section guide .
Heading content
| Setting | Options | Description |
|---|---|---|
| Heading | Main title shown above the carousel. In a collection block, it replaces that collection's title on its card; leave it blank to use the collection's own title. | |
| Description | Text shown under the heading, centered above the carousel. | |
| Heading size | • Large | Size of the main heading: large, medium or small. |
Collection
| Setting | Options | Description |
|---|---|---|
| Image ratio | • Adapt to image | Crops every collection image to the chosen shape. Adapt to image keeps each image's own proportions. |
| Content alignment | • Left | Aligns each collection's title and product count to the left or the center. |
| Show product count | Shows the number of products in each collection under its title. |
Layout
| Setting | Options | Description |
|---|---|---|
| Columns on desktop | Number of collection cards across on desktop. Tablets show one fewer when this is above 3. | |
| Column gap | • No gap | Space between collection cards: none, small (5 px), medium (24 px, or 12 px on mobile) or large (32 px, or 24 px on mobile). |
| Columns on mobile | Number of cards visible at once on mobile. A decimal between 1 and 4, such as 1.5, shows part of the next card and lets shoppers scroll freely. |
Carousel
| Setting | Options | Description |
|---|---|---|
| Show arrows | Shows previous and next arrow buttons on both sides of the carousel on desktop. Phones always show the arrows below the carousel, even when this is off. | |
| Show pagination | Displays carousel pagination. |
Appearance
| Setting | Options | Description |
|---|---|---|
| Color scheme | Edit color schemes in Theme settings. |
Section layout
| Setting | Options | Description |
|---|---|---|
| Section width | • Page width | Sets how wide the section content is. Page width keeps it inside the standard content width, Wide stretches it closer to the screen edges, and Full width spans the whole screen. |
| Top padding | Space above the section content, in pixels. | |
| Bottom padding | Space below the section content, in pixels. | |
| Show top border | Draws a thin line along the top edge of the section. |
Blocks
Collection (featured_collection)
Adds one collection card. Set the collection, and optionally replace its image or title.
| Setting | Options | Description |
|---|---|---|
| Collection | The collection this card links to. Its title and featured image appear unless you set a heading or image on the block. | |
| Collection image | Leave blank to use the collection's image. | |
| Heading | Main title shown above the carousel. In a collection block, it replaces that collection's title on its card; leave it blank to use the collection's own title. |
Notes
The section accepts up to eight collection blocks.
No comments yet