Taiga
documentation

Collection list

The Collection List Section is designed to showcase collections on your site, similar to how the Featured Collection section highlights individual products. It allows for a streamlined display of your collections, making it easier for customers to navigate through your catalog. Customize this section with various settings to match your brand's aesthetic and layout preferences.

 

✅ Steps

  1. Open the Theme Editor.
    Navigate to your Shopify dashboard and open the Theme Editor for your store.
  2. Add the Collection List Section.
    Click on 'Add section' and select 'Collection List' to integrate this section into your page layout.
  3. Save your changes.
    After customizing the Collection List section, click 'Save' to implement your adjustments.

Configure the Section Settings

Color Scheme: Choose a color scheme that complements your site's design.

Desktop Layout Settings:

Display Type: Choose Grid or Slideshow.
Collections Per Row: Select the number of products (2-5).
Grid Gap: Adjust the space between items. Set to -1 to use the Theme settings Gutter value as the gap.
Margins: Customize top and bottom margins

Tablet Layout:

Products Per Row: Select the number of products (2-5).
Uses Desktop's display type and margin settings.

Mobile Layout Settings:

Display Type: Choose between Slideshow, Slideshow Peeking Items, and Grid.
Products Per Row: Select the number of products (2-5).
Grid Gap: Adjust the space between items.
Margins: Customize top and bottom margins.

Slideshow Settings:

(For "Display Type" set to "Slideshow")
Enable Autoplay: Toggle for the slideshow.
Autoplay Interval: Set the rotation interval (2-8 seconds).
Sliding Behaviour: Choose slide movement - one by one or all visible at once.

Customize Blocks:

Section Header: Add a subheading, select heading tags, input text, adjust text alignment, and add size modifier for Desktop and Mobile.


Collection Blocks:

Incorporate blocks to showcase different collections on your site.
Select Collection: Choose a specific collection from your list to display.
Card Background: Customize the card's background with options for Solid, Gradient, or Transparent. This setting adjusts the background color, particularly impactful if the chosen image is in PNG format.
Choose an Image: Optionally, select an image for the collection. Manually selected images will override any existing images associated with the collection.

📝 Note:

Image Rendering Order

The first image to show in the collection card is the collection image (set from Products->Collections). If there is no Collection image, then the first product picture in the collection is used. Remember, manually selected images override existing images.