Product listing page: what it is and 5 parts that sell

What is a product listing page?

On Shopify, your collection pages and your search results page are product listing pages. Other platforms call them category pages.

A product listing page has one job: get each shopper to the right product page. That is the page where one product gets the whole screen.

In Baymard's August 2026 guide, 80% of ecommerce sites have serious usability flaws on their product listing pages. Baymard draws the guide from usability testing across more than 330 leading sites.

What does a Shopify collection page give you for free?

Your theme draws the page, and Shopify's free Search & Discovery app supplies the filters.

Two of Shopify's free themes, Dawn and Horizon, give you the same parts with different starting settings.

Theme defaults as Shopify ships Dawn 16.1.1 and Horizon 4.3.0, read November 3, 2026. Your copy may be older or edited.

Both themes cover all five parts for free, and neither puts sold-out products last in a collection. Each part below shows where the defaults stop. Check 3 of a Shopify store audit tests what your own collections show.

What filters should a Shopify collection page have?

A shopper after a green sweater in size M under $80 needs three filters: size, color and price. On a clothing store, show the colors as swatches.

In Baymard's mobile testing, 80% of test shoppers applied a price filter. Only 43% of 60 benchmark sites offered all five key filters: price, user rating, color, size and brand. And 28% of sites don't show the filters a shopper has already picked above or beside the grid, Baymard found.

Shopify caps a store at 25 filters, and one filter at 100 values. A collection with more than 5,000 products shows no filters at all. The price filter hides when a shopper switches to a currency other than your store's default.

If your filters were there yesterday and are gone today, count the products in that collection first. Filters on a big catalog covers large collections, and adding filters to Horizon walks through the setup.

How does Shopify sort products in a collection?

Two orders matter. The first is the order a collection opens in, which you set under "Products", the product list on the collection's admin page. The second is the sort menu, which a shopper can change.

If your admin lists Most relevant, a new collection starts there. Shopify bases it on "sales performance". Shopify's other starting orders are best selling, title A to Z or Z to A, price high or low, newest or oldest, and "Manually", the order you set by hand. Best selling ranks by all-time orders, so last winter's hit can lead a collection all summer.

Baymard names four sorts a list should offer: price, user rating, best selling and newest. In its 2021 research, 64% of desktop sites missed at least one. Shopify's sort menu has price, best selling and newest, and no rating sort.

In Shopify, a manual order is the only way to set an order of your own. On a big collection, read manual sorting for big catalogs before you rely on it.

What should the first row of a collection show?

The first row should show products a shopper can buy, but none of Shopify's collection sorts is based on stock, so a sold-out product can keep its spot there. Search & Discovery already puts sold-out products last in your search results by default, a setting that does not reach collections. The free route is a manual order with sold-out products moved "To the end", redone each time stock changes. Pinning one best seller above a newest-first list means setting the whole collection to manual too.

What should a product card show on a collection page?

A shopper scanning the grid wants five things from each card: the price, a second photo, the colors, a badge such as Sale, and a way to add to cart from there.

"Quick add" puts an add to cart button on the card. Dawn ships it off and shows no swatches on its cards. Horizon ships it on for desktop, and shows swatches once your product colors have them set. In Dawn, switching it on is one setting in the collection page's "Product grid" section. The same section's "Image ratio" sets the shape of every card's photo.

When the colors live only on the product page, a shopper who sees one green sweater may never learn it also comes in navy. Every question a card leaves open costs the shopper a trip to the product page and back.

How badges and swatches should look is the work of visual merchandising, and color swatches on Shopify collection pages shows how to put them in your filters on Dawn.

How does a collection page load more products?

Dawn splits a collection into numbered pages, and Horizon loads more as the shopper scrolls. Which one fits your store, and what each does to the Back button, is in our guide to Shopify pagination.

What does Sledge add to a product listing page?

Sledge is a Shopify app for search, filters and merchandising that runs on your collection pages and your search results page. You build filters from size, color, price, tags or your own product details, and show them as checkboxes, swatches or a price slider. A merchandising rule can pin a product to the top of a collection or push the ones you pick further down.

In Sledge's product list settings, "Move Sold Products to the end of product listing" keeps sold-out products on the page, after the ones you can sell. To load more products, the filter layout offers "Load more" and "Infinite scroll" beside page numbers, on all four paid plans. Sledge's sort menu has no rating sort.

Sledge doesn't change your theme's own grid settings. Its grid takes the theme's place on the pages where it runs, so choose how more products load in one place, not both.