Collection list page
The Collections list template provides the layout and design of the /collections
page that displays your store's collections in a grid. Use this page to give customers an overview of all or selected collections.
Customize page style
Click the page section to edit the general styles, available for all page templates:
Page header
Choose to show the Page title and add optional Text below the title.
Click Collection list page section to find settings
Setting | Description |
---|---|
Show page title | Display the title of the collection list page. |
Text | Add multiple lines of rich text to describe the page. |
Select collections to show
By default, the Collection list shows all published collections. You can choose to display only Selected collections.
Collections are created and edited in your Shopify admin. See Shopify's Collections manual ↗ to learn how to group products into collections.
Click Collection list page section to find settings
Setting | Description | Options |
---|---|---|
Collection to show | Choose which collections to display on the page. | All Default Selected |
Change layout
Change the number of columns to display for desktop and mobile screens.
Click Collection list page section to find settings
Setting | Description | Options |
---|---|---|
Number of columns on desktop | Select the number of collections per row on desktop screens. | 2 3 4 Default |
Number of columns on mobile | Select the number of collections per row on mobile screens. | 1 Default 2 |
Number of rows on desktop | Set the number of rows to display on desktop. | 3-10 Default: 5 |
Set up collection images
Choose which images to use for the collection items. By default, the collection image will be used. If no collection image is set, the first product's image will be used.
To change the collection image, go to Products > Collections in your Shopify admin. Click the name of the collection, then click Add image or Edit > Add image.
Click Collection list section to find settings
Setting | Description | Options |
---|---|---|
Image source | Choose which image to display for the collection list items. | First product image Collection image Default |
Change image aspect ratio
Change the aspect ratio to crop images to be a uniform shape.
The aspect ratio of an image is the proportion between its width and height (w:h). A square image has equal width and height (1:1), whereas most images are either wider (2:1) or taller (1:2).
Click Collection list section to find settings
Setting | Description | Options |
---|---|---|
Aspect ratio | Select an aspect ratio to crop images to be a uniform shape, or select Natural to display images in their original shape. | Natural Default Portrait (2:3) Portrait (4:5) Square (1:1) Landscape (5:4) Landscape (3:2) |
Add image overlay
The image overlay adds a layer of color to your image. Overlays help balance image and text for clarity and readability.
Choose a Color scheme for the overlay and overlay text
Change the Opacity to make the overlay more or less transparent
Click Collection list section to find settings
Setting | Description | Options |
---|---|---|
Overlay opacity | Use the slider to change the transparency of the overlay. | 0 - 100% Default: 20% |
Last updated