Collections list

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.

See demos: Vogue | Craft | Organic | Chic

Select collections to show

By default, the Collection list shows all published collections. You can choose to display only Selected collections. To customize your list, choose 'Selected' and add collection to the collection list

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

Select collections 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.

3 4 5

Number of columns on mobile

Select the number of collections per row on mobile screens.

1 2

Number of rows on desktop

Set the number of rows to display on desktop.

3 - 10

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) Square (1:1) Landscape (3:2)

Change collection title style

Customize the position and style of the collection title.

  • Set the Collection listing title style to Overlay or Beneath.

  • Set the Collection title background style to Solid or Gradient.

Overlay title style
Solid overlay background

Click Collection list page section to find settings

Setting
Description

Collection listing title style

Select the number of collections per row on desktop screens.

Overlay title background style

For overlay style, display a Solid or Gradient color background.

Overlay title

Set the color of the collection title.

Overlay title background

Set the background color of the collection title.

Related links

Templates

Last updated

Was this helpful?