Collection list

The Collection list section enables you to showcase a set of collections in either a Grid or Carousel format, making it easy for customers to browse through your product categories.

How to add collection list section

Quick Start Guide


  1. Access the Theme Editor: Navigate to `Online Store > Themes > Customize`.
  2. Add a Section: Click on `Add section` and select the desired section from the list of available sections.
  3. Customize Your Section: Adjust the settings such as display type, alignment, and visibility according to your preferences.

If you need a more detailed, step-by-step guide on accessing the theme editor, adding sections and blocks, refer to our Setting up theme sections and blocks article.

General section settings

Within this section, you'll find common settings like section headers, containers, visibility options, and color settings that are consistent across all sections. For more detailed information on these shared settings, please refer to the Common settings between all sections article.

Layout Settings

  • Display Type: Choose between a grid or carousel layout for your collections.
  • Collections per Row: Select how many collections to display per row (2-5 on desktop, 1-2 on mobile).
  • Spacing Between Collections: Adjust the spacing between collections (10-50px on desktop, 10-50px on mobile).

Collection Customization

  • Image Ratio: Select the image ratio for collection images (Adapt, Square, Portrait, Landscape).
  • Custom Ratio: Set a custom image ratio if the default options don't fit.
  • Heading Size: Choose the size of the collection headings (small, medium, large).
  • Show Product Count: Display the number of products in each collection.
  • Content Alignment: Align the content (left, center, right) for desktop and mobile.
  • Overlay Opacity: Adjust the opacity of the overlay on collection images (10-100%).

Carousel Settings

  • Show Arrows on Desktop: Enable or disable navigation arrows in carousel mode.
  • Auto Rotate: Automatically rotate collections in carousel format.
  • Rotate Speed: Set the speed for auto-rotation (3-10 seconds).

Color Settings

  • Color Scheme: Choose the color scheme for the section to match your theme.
  • Collection Color Scheme: Adjust the color scheme specifically for the collection blocks.

Block Settings (Each Collection)

  • Collection: Select the collection to display.
  • Custom Image: Upload a custom image for the collection or use the default collection image.
  • Collection Title: Customize the collection title or leave it as the default.
Can't find what you're looking for?
Our support staff are here to answer your queries, so don't hesitate to write to us!