Product listing

Showing a list of products based on a category in grid or list view.

Steps

  1. In the theme editor (Customize), open the template selector

  2. Select Collections, then Default collection.

  3. On the left-sidebar, add Product listing.

  4. Make necessary changes > Save.

General and Layout

  • Control the listing's container type and layout.

  • Show the number of products per row and per page.

  • Enable or disable the columns switcher.

Sorting and filtering

Enable/disable filtering and sorting by options. You can either choose to display filters by storefront filters or by custom tags.

How to create the store filter

Steps

  1. In the theme editor (Customize), open the template selector

  2. Select Collections, then Default collection.

  3. On the left-sidebar, add Product listing.

  4. Add block "Filter by tags"

  5. Change the filter title and its tags list (separated by a comma). Choose a suitable design for the filter display.

  6. Merchants can decide to display the filter option expand or collapse by default.

7. Save.

To make your tags work best for you and your business, check out this Shopify guideline for tags:https://help.shopify.com/en/manual/products/details/tags

You can also change the filter position, title, and height.

Pagination

Enable pagination in 3 ways.

Storefront filters settings

This setting is for storefront filters only. You can enable changing product card variants on filtering and showing results count on filter items.

Last updated