Collections list

The "Collections list" page displays the list of collections available in your store.

Tip: To edit the page, choose the Collections list template in the top drop-down. Then, press the "Collections list page" section.

Collections list page

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:

Content

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 decided 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:

Desktop

Mobile

Tip: To add the block, press the "Add Collection" button. You can add numerous content blocks to display collections on the page.

Collection

In the following block, you can decide what collection should be displayed on the pages. Hit the "Select collection" button and connect a collection with the block.

Here is how the block might display in the section: