Skip to main content
The Main List Collections template displays a grid of collection cards on the /collections page, allowing you to show all collections automatically or manually curate specific collections with custom imagery and content. This template is perfect for stores with multiple product categories, allowing customers to browse and navigate to specific collection pages easily. Use this template to create an organized catalog overview that helps customers discover and access your various product categories.

Template Settings

Control which collections appear on the page:
  • All (default) - Automatically display all published collections
  • Selected - Manually choose specific collections via collection blocks

All Mode

Automatic, chronological display of all collections

Selected Mode

Manual curation with custom order and optional override images/titles
Use “Selected” for curated collection showcases or to highlight specific categories. Use “All” for automatic collection listing.
Choose how additional collections load:
  • Default (default) - Traditional page numbers (1, 2, 3…)
  • Load More - “Load More” button for progressive loading
“Load More” provides smoother UX, while traditional pagination is better for SEO and allows users to jump to specific pages.
Control how many collections display before pagination.
  • Range: 3-50 collections
  • Step: 1
  • Default: 12
Recommendations:
  • 9-12: Standard for most stores (3-4 rows in 3-column grid)
  • 20-24: High collection count stores
  • 6: Simple stores with few collections

Blocks

Collection Block

Add specific collections when “Selected” mode is active.
Limit: Up to 50 blocksSettings:
  • Collection: Collection picker to select specific collection
  • Image: Optional custom image override (replaces collection’s featured image)
  • Title: Optional custom title override (replaces collection name)
  • Heading Size: H6 (XS) to H2 (XL), default: H2
  • Color Scheme: Per-card color scheme override (default: scheme-1)
Image and title overrides are optional. If left blank, the block uses the collection’s default featured image and name.
Use custom images to create consistent visual style across all collection cards, even if actual collection images vary.

Display Modes

All Collections Mode

When to Use:
  • Standard collection directory
  • Automatic updates as collections are added
  • Minimal manual maintenance
  • Alphabetical or chronological order
Behavior:
  • Shows all published collections
  • Automatic ordering
  • Updates automatically when collections added/removed
  • Uses collection’s featured image and name

Selected Collections Mode

When to Use:
  • Curated collection showcase
  • Custom collection ordering
  • Featured categories only
  • Landing pages with specific collections
Behavior:
  • Shows only collections added via blocks
  • Custom order (block order in Theme Customizer)
  • Manual updates required
  • Supports image/title overrides
  • Great for highlighting key collections

Collection Card Display

Each collection card automatically shows:
  • Featured image from collection settings or custom override
  • Responsive scaling
  • Clickable to collection page
  • Hover effects (theme-dependent)
  • Collection name or custom override
  • Configurable heading size (H6-H2)
  • Clickable to collection page
Some themes display:
  • Number of products in collection
  • Updates dynamically
  • Format: “120 products” or similar
Optional (theme-dependent):
  • Excerpt from collection description
  • Truncated for card display
  • Provides context

Best practices

Collection count

For 3-6 collections use 6 per page with simple navigation. For 7-20 collections use 12 per page (medium stores). For 20+ collections use 12-24 per page with pagination, consider collection categories and subcategories.

Image guidelines

Use minimum 800x800px resolution, 1:1 (square) or 4:3 aspect ratio, JPG/PNG under 200KB each. Use lifestyle images showing products in context, maintain consistent style/aesthetic, ensure images clearly represent collection content.

Collection organization

Use clear descriptive names keeping titles concise (1-4 words). Example: “Summer Dresses” not “Summer”, “Men’s Sneakers” not “Shoes”. Organize by product type, use case, demographic, or season - stay consistent with one principle.

Custom overrides

Use custom images to create visual consistency, replace poor-quality images, implement seasonal/campaign imagery, match brand aesthetic. Use custom titles for seasonal promotions, campaign names, improved clarity, or A/B testing.

Pagination strategy

Default pagination is better for SEO (crawlable pages) with clear progress and page jumping. Load More offers better mobile UX with seamless browsing and infinite scroll feel. For 12 or fewer collections, pagination won’t appear.

Use Cases

Product Categories

All mode showing automatic list of product type collections (Shirts, Pants, Shoes, Accessories)

Curated Showcase

Selected mode featuring 6-8 hero collections with custom imagery for landing page

Seasonal Navigation

Selected mode with seasonal collections (Spring, Summer, Fall, Winter) using custom override images

Department Store

All mode with 20+ collections organized by department, 12 per page

Boutique Shop

Selected mode with 6 carefully curated collections, no pagination needed

Multi-Brand Store

All mode showing collections for each brand, alphabetically organized

Collection Page

Individual collection page showing products within a collection

Collection Banner

Hero banner for individual collection pages

Featured Collections

Section for displaying collection grid on homepage or other pages

Troubleshooting

Possible Causes:
  • No published collections in store
  • Template set to “Selected” with no collection blocks
  • Collections not published
Solutions:
  1. Create and publish collections in Shopify Admin
  2. Switch to “All” mode or add collection blocks
  3. Verify collections are published (not draft)
Verify:
  • Image uploaded successfully in block settings
  • Image file format is supported (JPG, PNG)
  • Browser cache cleared
  • Image override field has valid image
In All Mode:
  • Collections display chronologically or alphabetically (theme-dependent)
  • Cannot manually reorder in “All” mode
In Selected Mode:
  • Order matches block order in Theme Customizer
  • Drag blocks to reorder collections
Check:
  • More collections exist than per-page setting
  • JavaScript enabled in browser
  • No theme conflicts
  • “Load More” button functional (if using that style)

Quick Summary

  • Purpose: Collections directory/listing page
  • URL: /collections (default Shopify collections page)
  • Display Modes: All collections (automatic) or Selected (manual)
  • Blocks: Up to 50 collection blocks with custom images/titles
  • Pagination: 3-50 collections per page, traditional or load more
  • Card Features: Image, title, optional product count/description
  • Customization: Per-card color schemes, heading sizes, image overrides
Collections are created in Shopify Admin → Products → Collections. This template controls how the collection listing page displays, not individual collection content.