This section displays a list of collections using circular images, often used as a visual navigation bar or a featured category list.
Control the overall visibility and layout of the section.
Reveal sections on scroll | Enable this toggle to trigger a smooth animation as the section enters the user's viewport. |
Hidden on desktop | Enable this option if you want to hide the section on larger screens and display it only on mobile devices. |
Color scheme | Select a predefined color palette to instantly update the background and text colors for the entire section. |
The Section header settings allow you to add context to the collection list:
Text Content | Input a Caption (small text above the title), a main Heading, and a Description to provide more context for the section. |
Heading size | Adjust the visual size of the title to match your store's design hierarchy. |
Heading tag | Select the appropriate HTML tag (e.g., h1, h2, h3) for SEO structure without altering the visual appearance. |
Alignment | Toggle Align center to center-align the text content; otherwise, it will default to the left. |
Image ratio | Select the aspect ratio (e.g., Square, Portrait, Landscape) for the collection images to ensure a consistent look across the grid. |
Each Collection item represents a single collection displayed in the section.
Collection | Click the Select collection button to choose the specific product group you want to display. |
Image | Upload a custom image to represent the collection. If left empty, the theme will automatically display the default collection image. |
Title | Enter a custom title for the collection. If you leave this field blank, the default collection name will be used. |
Link | Add a custom link to redirect users to a specific page. If left empty, the block will automatically link to the standard collection URL. |
Instead of adding each collection individually as separate blocks, you can now use the Collection source toggle to import multiple collections at once.
From list | Pulls collections from a single list. This is much faster for large groups and supports Metafields for automated updates. |
From blocks | Allows you to manually add, drag-and-drop, and configure each collection as a separate block within the section. |
Choosing From list is ideal if you have a set of collections that changes frequently. By connecting a Metafield, you can ensure the section updates automatically based on the specific page a customer is viewing.