Collection Page Setup

Collection pages display products in a grid.

Configure a Collection Page

  1. Open Online Store > Themes > Customize.
  2. Use the page selector to open Collections > Default collection.
  3. Open the Collection page section.
  4. Enable filtering and sorting if needed.
  5. Set products per page.
  6. Set desktop and mobile columns.
  7. Choose product image ratio.
  8. Configure product card options.
  9. Save.

Product Card Options

  • Show secondary image on hover: Shows a second product image when customers hover over a product card. Use this to reveal alternate angles, details, lifestyle images, or color views.
  • Show vendor: Shows the product vendor. Useful for multi-brand stores; usually unnecessary for single-brand stores.
  • Show product rating: Shows rating stars when review metafields exist.
  • Show add to cart button: Adds purchase controls to product cards. Use this for simple products; turn it off when customers should read product details first.
  • Enable quick view: Lets customers preview or interact with product details without leaving the collection page, where supported.

Collection Page Settings

  • Enable filtering: Shows filter controls. Filters are managed in Shopify Search & Discovery, so this setting only displays filters that are configured and available from product data.
  • Enable sorting: Shows the sort dropdown.
  • Products per page: Controls how many products appear before pagination.
  • Columns on desktop: Controls how many product cards appear per row on desktop.
  • Product image ratio: Controls product card image shape.
  • Columns on mobile: Controls how many product cards appear per row on mobile.

Spacing is controlled using the shared padding settings. See Section Spacing and Padding.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.