Collections and Product Listings
A collection groups products for navigation and merchandising. On collection template pages, collection contains the current collection's metadata and a paginated subset of products. Smart collections are rule-based; custom collections are manually curated.
Collection page with pagination
<header class="collection-header">
<h1>{{ collection.title }}</h1>
{% if collection.description != blank %}
<div class="rte">{{ collection.description }}</div>
{% endif %}
<p>{{ collection.all_products_count }} products</p>
</header>
{% paginate collection.products by 24 %}
<div class="collection-grid">
{% for product in collection.products %}
{% render 'product-card', product: product %}
{% endfor %}
</div>
{{ paginate | default_pagination }}
{% endpaginate %}- collection.handle — URL slug (/collections/programming)
- collection.products — products on current page (inside paginate)
- collection.all_products_count — total across all pages
- collection.products_count — same as all_products_count on collection pages
- collection.image — collection featured image for banners
- collection.sort_options — available sort orders for filter UI
- collection.filters — Storefront filtering API (OS 2.0)
Tip: Use collection.all_products_count for 'Showing X of Y' labels. collection.products.size is only the current page count inside paginate.