Default collection
The Default collection template controls the product grid, filters, and card layout for every collection page in your store.
Every collection page uses this template by default. Configure it to control how the product grid is structured, how filters and sorting behave, and what information appears on each product card.
Theme Editor → page selector → Collections → Default collection
Collection page
The Collection page section is the core of this template. It controls the collection header, product grid layout, filter panel, and every product card within it.
Collection image and description
The collection header displays the name, product count, description, and banner image — all pulled from Shopify Admin.
To update the collection description or banner image, go to Shopify Admin → Products → Collections and edit the collection directly.
Show image under heading — places the banner image below the collection name rather than above. Useful when the heading needs to appear first for SEO or visual hierarchy reasons.
Product grid
Enable availability toggle — adds an "In stock only" toggle above the product grid. Works independently of the main filter panel — customers can filter by stock status without opening the full filter drawer.
Desktop filter style — three options that behave differently depending on the store's navigation layout:
Horizontal
Filter bar spans across the top of the grid
Vertical
Filters appear in a sidebar on the left — automatically switches to Drawer in sidebar-based navigation layouts
Drawer
Filters open in a sliding panel. Default on mobile regardless of the desktop setting
Drawer button position — choose whether the filter button appears Inline with heading (next to the collection name) or Below heading (on a separate line).
Tabs always open — enter filter names (e.g., Size, Color) to keep those tabs permanently expanded in Drawer and Vertical styles. Separate names with commas.
Description of filters with 'AND' operator — adds a short label (e.g., "Match all") that explains to customers that selecting multiple values within a filter shows only products matching all of them. Learn more about AND filter behavior.
Infinite scroll — controls navigation at the bottom of the product list:
Disable
Classic numbered pagination
Button
"Load more" button reveals the next batch of products
Auto
True infinite scroll — products load automatically as the customer scrolls
Grid type — five options. Two, Three, and Four columns are fixed-width grids. Alternative 1 and Alternative 2 are asymmetric layouts where products vary in size across rows.
Grid gap → Custom — switch from Default to Custom to set independent column and row gaps for desktop and mobile separately.
On hover
Controls what happens when a customer hovers over a product card:
Second image
Shows the second product image
Slider
Slides through all product images
Hover gallery
Shows a row of image thumbnails below the card
Nothing
No hover interaction
Enable 'Add to cart' button — shows a quick add button on the card. If the product has multiple variants, clicking it opens a Quick View popup for variant selection before adding to cart.
Enable 'Quick view' button — opens a product popup with full details without navigating away from the collection page.
Product card
Most settings here are self-explanatory. Non-obvious ones:
Show short description — displays the product subtitle on the card. Requires setting up the Product subtitle metafield in Admin → Settings → Metafields and metaobjects → Products. See Product subtitle.
Enable color pills — shows color variant swatches directly on the product card. Requires color pills to be configured in Theme Settings → Variant selector.
Show pickup availability — displays in-store pickup status on the product card. Requires retail locations configured in Shopify.
Last updated
Was this helpful?