Collection Page
The TabletopForge collection page (main-collection.liquid) provides a full-featured product browsing experience with filtering, sorting, and a grid layout optimized for miniature and gaming product photography.
Collection Layout Overview
The collection page is divided into two primary areas:
| Area | Description |
|---|---|
| Collection Banner | Full-width header showing the collection title and description |
| Product Grid | Responsive grid of product cards |
Collection Banner
The Collection Banner section (collection-banner.liquid) renders at the top of every collection page. It displays:
- Collection title
- Collection description
- Optional background image (set via the collection's featured image in Shopify Admin)
To set a collection banner image:
- In Shopify Admin, go to Products → Collections.
- Open the target collection and upload a Collection image in the Collection image field.
- The image will appear as the banner background on the collection page.
Product Grid Configuration
The product grid is controlled by the Main Collection section settings. Configure it in the theme editor by clicking Main Collection in the sidebar.
| Setting | Description | Default |
|---|---|---|
| Products per page | Number of products shown per paginated page | 12 |
| Grid columns (desktop) | Number of columns in the product grid on large screens | 4 |
| Grid columns (mobile) | Number of columns on mobile | 2 |
| Show product vendor | Display the brand/vendor name on product cards | false |
Sorting & Filtering
The collection page includes a native Sort dropdown in the collection toolbar. Available sort options:
- Featured
- Best Selling
- A–Z / Z–A
- Price: Low to High / High to Low
- Date: Newest / Oldest
Filtering by tags or price ranges requires the Shopify Search & Discovery app (free from the Shopify App Store), which provides native faceted filtering support.
Product Status Badges
TabletopForge product cards display availability badges automatically:
| Badge | Condition |
|---|---|
| In Stock | Product is available for purchase |
| Limited | Product has the tag Limited or limited |
| Sold Out | Product is unavailable |
Badges are rendered on the card thumbnail overlay and require no manual configuration.
Collection Page Template Variants
You can create additional collection templates for different visual layouts:
- In the theme editor, click ⋯ next to the collection template name.
- Select Create template.
- Name the template (e.g.,
collection.stl-files). - Assign it to a specific collection by going to Shopify Admin → Products → Collections → open a collection → Theme template dropdown.
This allows you to have separate layouts for physical products, STL files, or paint/tools collections.