What are collection pages?
Collection pages are an essential part of most online stores, and are the ideal way to organize and present collections of products in a gallery-style format. Grouping and showcasing products in this way can aid product discovery, assist with upselling and potentially increase conversion rates.
How to create a collection
There are two main elements that make up a collection page; the first is the collection of products itself, and the second is the collection page template which, when assigned to a collection, controls the layout of the products as well as the page functionality.
Collections of products are created in the Shopify admin area, within Products > Collections > Create collection. Keep in mind that collections are intended to help your customers find products and are most effective when containing products of a certain type, size, color or category. Refer to Shopify's collections documentation for more.
Tip
Two types of collections can be created in Shopify; an automated collection which uses selection conditions to automatically manage products, or a manual collection which only includes the products that you choose individually.
How to set up the collection page header
In the Boost theme, the collection page header can have three layouts; a simple header with the collection name and description, a feature header showing the the collection name, description and image or a collection specific feature header which includes a featured product and allows for collection specific colors.
Steps
- Open the Theme editor, select Collections from the dropdown at the top and choose the desired collection template (e.g. Default collection).
- Click on the word Collection to edit the collection page settings.
- For a simple layout with only the collection title and description, deselect Enable feature header.
- For a layout including an image and coloured background, select Enable feature header. To change the default background color go to Theme Settings > Colors > Feature header background.
- For a more complex feature header with a featured product and custom colors, select Enable feature header. Then, click Add collection to add a collection block. Within the block settings, select the Collection to be shown and choose a Featured product which will be shown next to the collection image. Pick colors for the text, background and Overlay for that specific collection.
Note
How to set up the collection page
Steps
- Open the Theme editor and select Collections and choose the desired product template (e.g. Default collection).
- Click Collection to edit the Layout settings.
- In the Layout settings, choose the number of products per row on desktop and mobile. Set the Products per page and choose whether to show a total product count at the top of the page. Select Show vendor to show the vendor on each product card.
Filtering and sorting
One of the most powerful features of a collection page is allowing customers the ability to filter and sort products within a collection. This helps your customers to get to the products they want as quickly as possible.
Steps
- Open the Theme editor and select Collections from the dropdown at the top then select your preferred template (e.g. Default)
- Click on Collection to see the collection page settings and scroll to the Filters settings.
- Choose to Enable filtering and select whether to Show product counts. The filters shown are managed using Shopify Search & Discovery.
- In the Sorting settings, choose whether to allow customer to change the sort order and whether to show the 'Featured' sort option. This is useful if the products in the collection have been sorted manually in the admin.
How to control the product card layout
In Theme Settings > Products there are settings to control the layout of a product card. These settings are relevant to any page or section throughout the store that displays a product card. The Image shape and Image alignment settings can all be adjusted to ensure that images in product cards are displayed in the best way possible. Where a product has more than one image, the Show secondary image on hover setting can be selected.
Product labels
Product labels can be shown over the product images on the collection page for items that are on Sale and Sold out. Go to Theme Settings > Products and select Show sale label and Show sold out label.
Swatches
Refer to Swatches.
FAQs
How do I change the order of products on the /collections/all catalog page?
All Shopify stores have a page at the URL your-store.com/collections/all that lists all of the visible products in the store. This is the store's catalog page. By default, products on the catalog page are shown in alphabetical order. To control what is shown or change the collection heading, go to the Shopify admin area and create a new automated collection of all products and give this new collection the handle all. Refer to the Shopify's Catalog page guide for more details.
How do I show review stars on the collection page?
If your store is using a reviews app which links to Shopify's standard rating metafield, review stars can be shown below products on the collection page. Go to Theme settings > Products > Product ratings > Show rating in product grid.
How do I control which filters are shown?
This is managed using the Shopify Search & Discovery app. Refer to the Shopify Search & Discovery guide to learn more.
Can't find what you're looking for?
Our support staff are here to answer your queries, so don't hesitate to write to us!
Contact us