Skip to main content
Product listing pages are quite similar to search, except that there’s no search field/search modal. Instead of being based on a search query, they’re based on a so-called listingQuery which is an id representing what products to show.

​
Why does “product listing page” mean something different in code?

Please see naming discrepancies in the reference section for more information.

​
The CategoryPage component

A CategoryPage for Women / Dresses: the breadcrumb, a QuickLinks row of the sibling categories with Dresses highlighted, the title Dresses with the product count, Filter and Sort buttons, and a four-column grid of dresses with image, title and price

A default CategoryPage

​
Additional exported components

Because you might want to have content between the BreadCrumbs, QuickLinks and the actual product listing, we also export the following components:
QuickLinks: a row of seven sibling-category chips (Bags, Dresses, Jewellery, Knitwear, Outerwear, Shoes, Watches) with the current category Dresses highlighted

QuickLinks


BreadCrumbs: Women / Dresses

BreadCrumbs

See the reference for more information.