Collection list
The Collection List section serves as a curated display of product collections, seamlessly integrating collections from your Shopify store.
Click on Collection list for the general settings
Layout Mode
- Stack Collections: Display collections in a stack layout.
- Carousel: Display collections in a carousel layout.
Grid Settings
- Adjust the grid column settings for different devices:
- Desktop: Set the number of columns to display on desktop screens.
- Mobile: Set the number of columns to display on mobile screens.
Text Content
- Subheading: Add a subheading to appear above the Collection List section.
- Heading: Set the main heading for the Collection List section.
- Body Content: Provide additional information or description for the Collection List section using the rich text editor.
Link Options
- Add a link to the Collection List section. Configure the link text, URL, and decide whether it opens in a new tab or the same tab.
Collection Card Style
Image Ratio: Adjust the image ratios for the collection images. Choose from:
- Square
- Landscape
- Portrait
- Adapt to Image
- circle.
Collection Name Display
- Overlay Name: Overlay the collection name over the collection image.
- Stack Name: Stack the collection name below the collection image.
- Background Options: Choose to display the collection name with or without a background.
- Alignment Options: Adjust the alignment of the collection name.
Collection Title Settings
- Heading Size: Control the font size of the collection titles.
Appearance Settings
- Padding: Adjust the padding at the top and bottom of the section.
- Padding Top: Adjust the top padding.
- Padding Bottom: Adjust the bottom padding.
- Color Scheme: Choose a color scheme for the section from predefined options.
- Custom CSS: Add custom CSS for advanced styling.
Collection Block Options
👜 Choose your collection | Collection → Select Pick which collection you want to showcase—whether it’s "Summer Essentials," "Bestsellers," or "New Arrivals." This is what customers will browse through! |
🖼️ Add a stunning Image | Image → Select Upload a beautiful cover photo for your collection. This could be a hero shot, a styled flat lay, or a model wearing your products. |
🎨 Styling and Overlay option | |
Text Color | Pick a color (like #000000 for black) to make sure your text stands out. 🔹 When does this work?
|
Overlay color | Use an overlay (e.g., #000000) to create contrast between your image and text, making everything easier to read.
|