Collections list
The "Collections list" page displays the list of collections available in your store.
Last updated
The "Collections list" page displays the list of collections available in your store.
Last updated
Tip: To edit the page, choose the Collections list template in the top drop-down. Then, press the "Collections list page" section.
If you need to display a title for the page, edit the "Heading". Leave the field empty to hide a title.
The heading size can be changed to "Small", "Medium", or "Large" in the "Title font size" drop-down.
Use the "Title color" option to change the color of the page heading. Set a color using the hex code, or specify the color directly in the paint pallet.
In the "Description" input field, insert short paragraphs to inform visitors about brands, collections, goals, store presentations, and more.
If you need to style text by color, use the "Description color" picker. Set a color using the hex code, or specify the color directly in the paint pallet.
Here is how the described settings might display on the page:
Use the "Dividing line" drop-down to specify whether to add the line separator on the top or bottom of the "Collections list page" section. If you need to use the line, select its position as "Top" or "Bottom". To hide the dividing line, use the "None" option.
The "Top spacing" option controls the space between the breadcrumbs/Header (if the breadcrumbs are disabled) and the "Collections list page" section. Use the scale from 0 to 100 pixels to set the desired parameter.
Handle the parameters on the "Bottom spacing" scale from 0 to 100 pixels to add or remove the space at the bottom of the "Collections list page" section.
In the "Select collections to show" you can decide if to display all collections available in a store by hitting the "All" checkbox.
Or specify the number of the selected collections using the "Selected" option. If you decide to use the selected list of collections, add each collection by pressing the "Add Collection" button underneath the section. For how to edit the "Collection" block, check the details below.
To decide the number of collections displayed in each row, use the "Collections in row" drop-down. The theme allows setting up 2, 4, or 6 items per row. These settings work for large screens. By default, the theme displays two items in a row on mobile.
Here you can pre-set the sorting order on the Collections list page. To Sort collections by: "Alphabetically, A-Z", "Alphabetically, Z-A", "Date, new to old", "Date, old to new", "Product count, high to low", "Product count, low to high".
The "Image ratio" can be changed from "Adapt to image" to "Portrait", "Square", "Landscape", or "Circle".
Use the "Image type" drop-down to predetermine whether to display the image of the first product in the collection or apply the image that you set as the main image of the collection in your Shopify admin -> Products -> Collections. Select "First product" or "Collection image" from the drop-down.
If you need to showcase a description for each collection, enable the "Show description" option. This option requires adding a collection description in your Shopify admin -> Products -> Collections.
Here is how the option works on the page:
In the following examples, you can view how the Collections list page might look on desktop and mobile:
Tip: To add the block, press the "Add Collection" button. You can add numerous content blocks to display collections on the page.
In the following block, you can decide what collection should be displayed on the page. Hit the "Select collection" button and connect a collection with the block.
Here is how the block might display in the section:
