How to design the ideal collection page

The 8-element collection page anatomy: breadcrumbs, intro SEO, filter bar, grid, sort, bottom SEO, plus plant-specific tile metadata.

Written By Bas den Hoed

The collection page is the workhorse of a plant webshop. It's where ad clicks land, where Google sends category-search traffic, and where browsing visitors decide whether your assortment is worth digging into. A grid of 36 products without context, breadcrumbs, or filters leaves half its conversion on the table. This article walks through the full collection-page blueprint β€” what every plant-shop category page needs, and the plant-specific tweaks that separate a competent grid from a high-converting one.

πŸ’‘ The #1 mistake: treating the collection page as just a product grid. Without breadcrumbs, an SEO intro, filters, and a useful sort, the page converts at roughly half its potential β€” and ranks for almost nothing.

Anatomy of a collection page that works

A plant-shop collection page has eight elements, in roughly this order. Skip any one of them and you leave either conversion or SEO on the table.

  • Breadcrumbs at the top: Home > Houseplants > Pet-friendly. Tells the visitor where they are, gives Google structure, and lets people climb back up one level without hitting "back".

  • H1 heading equal to the category name. One per page. "Pet-friendly houseplants", not "Welcome to our pet-friendly collection".

  • SEO intro, one to three short paragraphs directly under the H1. Answers the customer's question first ("Pet-friendly plants are non-toxic to cats and dogs β€” here are the 24 in our range"), then expands. Long enough to give Google something to rank on, short enough that visitors scroll past without resentment.

  • Filter bar on the left (desktop) or as a top sticky drawer (mobile). Five to seven filters maximum β€” see Filters & attributes for the per-filter logic.

  • Sort dropdown with three or four options: Relevance (default), Price low-high, Price high-low, Newest. Skip "Best selling" if you have under 50 products in the collection β€” the signal is too noisy.

  • Product grid, four columns desktop, two columns mobile, 24 to 36 products per page. More than 36 and the page weight and scroll fatigue both punish you.

  • Pagination or load-more, not infinite scroll on desktop. Infinite scroll breaks the footer (visitors never reach it) and hurts SEO crawl. On mobile, load-more is fine.

  • Bottom SEO block with three to five FAQ-style questions specific to this category. This is where most of the SEO weight actually lives. See SEO for category pages for the formula.

What goes in a plant-shop product tile

A product tile is not a thumbnail. It's a mini-PDP β€” enough information for the visitor to decide whether to click, without forcing the click for basic facts. For plants specifically, the tile should show:

  • Hero photo, square crop, lifestyle context if you have it. The same plant against a styled background outperforms the white-studio supplier image by a noticeable margin in click-through.

  • Product name + key spec, e.g. "Monstera Deliciosa β€” Ø 17 cm". Without the pot size in the title, you'll get an avalanche of "what size is this?" support questions.

  • Price, with strikethrough MSRP if on sale.

  • Stock indicator only when it's useful: "Last 3" for urgency (only if true), "Pre-order" for incoming stock, nothing when stock is healthy.

  • Plant-specific icons: light requirement (sun/shade icon), pet-safe (cat icon), care difficulty (1–3 leaves). Three icons maximum β€” more turns into visual noise.

  • Quick "add to cart" on hover (desktop) or as a small button (mobile). Optional, but removes friction for repeat buyers who already know the product.

What does not go on the tile: the full description, every variant, multiple photos in a slider, or a review-count badge unless you have at least 10 reviews per product on average. Sparse review counts on tiles look worse than no badge at all.

Filters belong here, not on the homepage

The collection page is the only place where filters earn their weight. Five to seven, no more β€” most plant shops can land on: Light (low / medium / bright), Pet-safe (yes/no), Pot size (Ø in cm), Care level (easy / medium / advanced), Price range, and one optional category-specific filter (mature height for garden plants, bloom colour for flowering plants).

Two rules for plant-shop filters specifically:

  • Filter the parent product, not the variant. A Monstera in 12 cm and 17 cm should appear once in the grid, with size-switching on the PDP. Showing the same plant three times because of pot variants makes a 30-product collection look like 90 β€” and clutters every filter.

  • Handle empty states gracefully. A filter combo that returns zero results should suggest relaxing one filter ("No results β€” try removing 'Pet-safe' to see 8 more plants") rather than dead-ending. Plant filters compound aggressively (Bright + Pet-safe + Under €25 + Bloom = often empty), so this matters.

Seasonal collections need different rules

A "Christmas plants" or "Mother's Day gifts" collection isn't an ordinary category β€” it's a campaign page with a hard expiry date. Two adjustments:

  • Pin the seasonal hero image at the top of the collection (above the SEO intro), not as a banner across the whole site. Tells the visitor they're in the right place without taking over.

  • Plan the depublish date when you create the page. December 26, the Christmas collection comes down β€” products go back into their year-round homes (Houseplants, Indoor) and the URL redirects to the next-best collection. Leaving "Christmas plants 2025" live in March kills the SEO halo of every category around it.

For the full seasonal cadence and lead times, see Seasonality: rotating your plant assortment year-round.

Mobile collection pages

Most plant-shop traffic lands on mobile, and the collection page is where mobile UX failures cost the most. Three rules that matter:

  • Filters in a top-sticky button that opens a drawer, not a permanent left rail (no room) and not buried at the bottom of the grid (visitors miss it). The button should show the active filter count: "Filter (3)".

  • Two-column grid, not three. Three-column on a phone screen makes the photo too small to evaluate a plant β€” and plant tiles live or die by the photo.

  • Load-more, not infinite scroll. Even on mobile. Infinite scroll prevents visitors from ever reaching the bottom SEO block β€” and that block is doing your category-page ranking work.

⚠️ Don't skip the SEO blocks. The intro and bottom-FAQ on a category page do more for organic ranking than any single product page. A grid-only collection page is a page that only ranks for its own brand-name searches.

Next action

Pick your top-three trafficked collections (check Shopify Analytics or GA4). For each one, audit against the 8-element anatomy above. Most resellers find at least three missing elements per page β€” usually breadcrumbs, the bottom SEO block, and a sensible filter empty-state. Fix those three on your top-three collections this week. The compound effect on conversion and SEO over a month is larger than rebuilding the homepage.