Expanse provides four collection page templates to help you organize and showcase your products: Default, Collection landing, No promos, and No sidebar.
The Collection landing template comes preloaded with multiple Featured collection sections, making it ideal for showcasing sub-categories. The No promos template removes the Promotion grid section, while the No sidebar template turns off the collection filters sidebar. These templates provide layout variations that can be helpful depending on your preferred design.
Customize the collection page template
Use the page selector to open Collections, then choose Default collection or another collection template.
Click the Collection header or Product grid section in the left sidebar to customize general settings of the collection page.
Collection header
The Collection header includes both the title and the description of the collection. Disabling Enable header hides this section from the page.
When enabled, the Collection image is shown as the header’s background. It uses the featured image assigned to the collection in the admin. When Overlay header over collection is enabled in the Header section, the header is displayed over the collection image.
Featured collection image - Shopify Help Center
The Parallax image feature applies a parallax effect to the header image as the page scrolls. The image will appear zoomed, which is necessary to fill the background and allow the parallax effect to function properly.
You can choose whether the parallax moves horizontally or vertically. The image above is an example of a parallax effect moving horizontally.
Product grid
The Product grid section contains the subcollections, products and collection filters.
Enable filter determines if collection filters are visible. They are placed in the left sidebar on desktop, and shown as a dropdown at the top of the product grid on mobile.
Filters are customized via Shopify's Search & Discovery app.
Follow Shopify's guide for setting up Faceted Filtering
Enable Collapse filters to have the filter tabs closed by default.
Turn on Enable color swatches to show visual swatches for the color filter. For more details about color swatches, see this guide.
Enabling the Show sort options setting displays the product sort dropdown. On desktop, it appears at the top right of the product grid, while on mobile it is included inside the filter dropdown.
Product grid blocks
Click the toggle beside Product grid to display the blocks. There are three block options to use: Collection description, Subcollections and Products.
Click and drag the blocks to change their order and reposition them within the product grid.
Collection description
This block displays the collection description added in the Shopify admin.
Subcollections
This block will automatically show subcollections when the navigation link for the current page contains additional collections beneath it. For more details about subcollections, see this guide.
Products
There are three product grid layouts available. You can choose which layout is enabled by default.
- Large grid shows 2 products per row on desktop and 1 on mobile.
- Small grid shows 3 products per row on desktop and 2 on mobile.
- List displays one product per row in rectangular blocks.
A maximum of 40 products are shown on each page before pagination appears.