Collection list
The "Collections list" section can be operated to display numerous collections with links to Collection pages for each.
Last updated
The "Collections list" section can be operated to display numerous collections with links to Collection pages for each.
Last updated
Tip: To hide the title, description, or button, leave the corresponding fields blank.
Paste the section's title to the "Heading" field. The "Heading font size" can be changed to "Small", "Medium" or "Large" sizes. If you need to colorize the title, use the "Heading color" picker.
To represent the section, insert any text lines to the "Description" placeholder. If you need to change a paragraph color, use the "Description color" picker.
The layout settings change the look and feel of the section.
Choose one of the options "In-grid heading", "Heading on top", or "Heading top center" in the "Layout" drop-down.
Use the "Mobile align" settings to change the alignment of the heading and description to the "Left" or "Center". Leave the "Auto" option to use the pre-designed theme settings.
To add a divider between sections, use the "Dividing line" to set the position: "Top", "Bottom", or "Both". The dividing line will be hidden once you use the option "None".
On the "Top spacing" and "Bottom spacing" scales, decide whether to add spaces at the top and bottom of the section. Control spacing settings from 0 to 100 pixels on each scale.
The number of collections per row can be set in the "Collections in row" drop-down. Decide if to display 2, 4, or 6 items in each row.
Choose the appropriate aspect ratio of the collection images in the "Image ratio". You can use one of the options that display well on both desktop and mobile views: "Adapt to image", "Portrait", "Square", "Landscape", or "Circle". Each image ratio, you can check .
The text alignment on all screen sizes can be defined in the "Alignment" picker. Display the title and description either on the "Left" or "Center".
The "Show product count" option helps to show or hide the number of products available in each collection. Deactivate the option to hide the number.
Enable swipe on mobile
Check the box to add scrollbars instead of displaying the list of collections on mobile view.
Activate the "Enable "View all" checkbox to show the "View All" button on desktop and mobile if the blog contains more articles than is displayed in the section.
Use the "Color" picker to change the button background color for the "Primary" style. For the "Secondary" style the colorized text and border inside the button will be added. If you used the "Link style", the color will be applied to the text link.
Check the following examples of how the section might be displayed on desktop and mobile:
Tip: This block can be used several times to configure each collection individually.
Choose the required collection by pressing the "Select" button.
Edit the "Description" field to introduce a collection. Leave the field empty to deactivate the description.
Image
If you need to add or change the collection's image, use the image library or upload media from your device.
Here is how the block might be displayed in the section:
Use the "Style" drop-down to change the button's appearance in the sections. The theme includes three styles that can work out in your store: "Primary", "Secondary", or "Link style". Each button style can be viewed on the following .