Collection list settings


Setting Description
Heading To add a heading to the section, simply enter the text in the provided field. In the top menu of the field, you can find options to customize the heading such as making it bold, italic, or adding a hyperlink. 
Heading size

The heading size setting offers three options to control the size of the section heading:

  • Small
  • Medium
  • Large
Image ratio

The “Image ratio” setting allows you to control how images are displayed on your website based on their width-to-height ratio. You have several options to choose from:

  • Adapt to image: This option uses the aspect ratio of the images, ensuring that they are not cropped and displayed in their original dimensions.
  • Portrait: This option crops the images to use a 2:3 ratio, creating a taller appearance with a width that is 2/3 of its height.
  • Square: This option crops the images to use a 1:1 ratio, creating a square-shaped display with equal width and height.
Image style
  • Standard: Collections are displayed with the image first, followed by a card containing the heading, description, and link.
  • Cover: All collections have an image that covers the content (heading, description, and link).
  • Cover First Card: Only the first card has an image that covers the content, while the others follow the standard collection card layout.
Cover card color scheme

Choose image style: Cover or Cover first card to see changes in Cover card color scheme.

*Each color scheme can set different color for heading, description and link. (For example, one collection block can have dark image and better to use color scheme with the light color for content, another collection block can have light image and better to use color scheme with the dark color for content).
Show description

Path:

  1. Navigate to Shopify admin panel;
  2. Click on Collections section;
  3. Click “Create collection” button on the right corner or click on created collection before from the list;
  4. In Description field, type a brief description about your collection;
  5. Mark here the checkbox to show this description.
Link label You can add a label to a link. After adding the label, the link appears automatically, and it will lead to the collection page with products.
Number of columns on desktop The “Number of columns on desktop” setting allows you to select the number of columns in which your content will be displayed on larger screens, and on tablets. You can select from 1 to 5.
Color scheme Applying a color scheme to a whole collection list section (except collections columns) automatically updates all associated colors set in the theme settings according to the created color schemes. You can edit colors in this block, but it will impact the other sections and blocks in which the same color scheme is used.  Learn more about color schemes.
Enable “View all” button if the list includes more collections than shown. “View more” leads to the page with all collections.

Mobile layout


Setting Description
Number of columns on mobile

Choose the view of the column on mobile:

  • 1 column
  • 2 columns
Enable swipe on mobile Allow users to swipe columns in a slider using arrows or just scroll on mobile devices.

Section paddings


Setting Description
Top padding The “Top padding” setting allows you to adjust the amount of space at the top of the section using a slider. 
Bottom padding The “Bottom padding” setting functions similarly to the “Top padding” setting, but controls the space at the bottom of the section. 
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us