This section displays a horizontal list of collections, typically styled with circular images, making it perfect for a visual navigation bar or category highlighter.
You have several controls for how the section sits on the page and who sees it.
Reveal on scroll: Toggle to show an animation when the section becomes visible while scrolling.
Make section full width: Toggle to stretch the section content to the edges of the screen.
Only show on mobile: Toggle to display the section only on mobile devices.
Color scheme: Select a color scheme to apply the section's background and text colors.
This section has specific settings for touch devices to encourage swiping.
Mobile slide width unit: Choose whether to set the slide width in percentage or pixels.
Mobile slide width: Adjust the width of each slide on mobile devices. A value below 100% allows part of the next slide to remain visible, encouraging users to swipe.
The Section header settings allow you to add context to the collection list.
Text Content: You can input a Caption (small text above the title), a main Heading, and a Description for more details.
Typography:
Heading size: Adjust the visual size of the title (e.g., Small).
Heading tag: Select the HTML tag (e.g., h2) for SEO structure without changing the visual look.
Alignment: Toggle Align center to center the text; otherwise, it will default to the left.
Yes, there are specific settings for the cards and footer area.
Images: Use the Image ratio dropdown (e.g., Square) to ensure your collection images are cropped uniformly before being rounded.
Button: You can add a call-to-action button at the bottom of the section by entering text in the Button label field.
Instead of adding each collection manually as an individual block, you can now use the Collection source toggle to pull in multiple collections at once.
From list | Select a group of collections all at once using a collection list or connect a Metafield. This is ideal for quickly displaying large sets of categories. |
From blocks | The traditional method where you add and configure each collection as an individual block within the section. |
Choosing From list is ideal for collections that change frequently. By connecting a metafield, the section can automatically update based on the specific page a customer is viewing.
