When One Image Per Collection Page Isn't Enough
Open any Shopify store with a deep catalog and you'll see the same pattern. A shoe in twelve colors shows up on the collection page as a single product card with a single image. The customer sees one color. They have to click in to discover the other eleven exist.
This is fine for a store with 20 products. It becomes a real problem at 200, where customers leave thinking you don't carry their preferred color when actually you do.
The Shopify community has been asking about this for years. A recent thread on the topic has over 600 views, and the same question gets posted every few weeks. Merchants want to know: how do you show variants on collection pages without paying for an enterprise theme or hiring a developer?
Here's how Shopify handles it by default, what merchants actually do about it, and what we built to make it easier.
What Shopify shows by default
A product on a Shopify collection page shows the featured image of the default variant. That's it. Some themes show a small color swatch row underneath, but only if the variants share a color taxonomy and the theme was built to display them. Others show nothing. Whether you see swatches depends entirely on which theme you're using and how it was built.
There's a reason for this. Collection pages render fast because they show one image per product. Loading every variant image upfront would slow the page down significantly on stores with hundreds of products. The default makes sense for most stores, but for stores where color or pattern is a primary purchase driver, it costs you discovery.
The split-product workaround
The most common workaround merchants use is splitting variants into separate products. Instead of one shoe with twelve color variants, they create twelve separate shoe products, each with its own collection page card, image, and URL.
This works. Big brands do it. Allbirds, Nike, and most fashion retailers split their core products across multiple listings to maximize discoverability and SEO surface area.
The downside is management. Twelve separate products means twelve sets of descriptions to update, twelve inventory items to track, and twelve places to update prices when something changes. For a small catalog that's fine. For a catalog of fifty configurable products it becomes a real job.
There's also a customer experience problem. When the products aren't linked, the customer who clicks into the red version of the shoe doesn't see the other eleven colors on the product page. They have to navigate back to the collection page and find them again, or assume those don't exist.
What helps
Showing color or image swatches directly on the collection grid solves the discovery problem without forcing customers to click into every product. They see five color circles under the product image, click the one they want, and the product card updates to show that color.
For stores that split products into separate listings, linking those products together on both the collection page and the product page means a customer who lands on the red version sees all the other colors as clickable swatches without leaving the page they're on. Each product keeps its own URL for SEO and its own unique imagery, but the customer sees them as one unified product.
Both of these are what Pasilobus Swatches and Listings does. Color swatches and image swatches on collection pages, variant linking on product pages, all configured through the theme editor without touching code.
The free plan covers most small catalogs. Paid tiers kick in when you need bulk import, advanced analytics, or unlimited variant linking across hundreds of products.
Worth checking
If your store sells anything where color, pattern, or material matters, open your collection pages on a phone and look at them the way a customer would. Can you tell at a glance how many colors each product comes in? If not, that's lost discovery happening every time a customer browses your catalog.
The fix takes about ten minutes to set up. The customer experience change is immediate.
