Product listing
Grid
List
Showing a list of products based on a category in grid or list view.
Steps
  1. 1.
    In the theme editor (Customize), open the template selector
  2. 2.
    Select Collections, then Default collection.
  3. 3.
    On the left-sidebar, add Product listing.
  4. 4.
    Make necessary changes > Save.

General & layout

  • Control the listing's container type and the layout.
  • Show the number of product per row and per page.
  • Enable or disable columns switcher.

Sorting & filtering

  • Enable/disable filter and sort by option. Merchants can either choose to display filters by Shopify or by custom tags.
Check the tabs below on how to create the filter.
Filter by tags
Filter by Shopify
Steps
  1. 1.
    In the theme editor (Customize), open the template selector
  2. 2.
    Select Collections, then Default collection.
  3. 3.
    On the left-sidebar, add Product listing.
  4. 4.
    Add block "Filter by tags"
  5. 5.
    Change the filter title and its tags list (separated by a comma). Choose a suitable design for the filter display.
  6. 6.
    Merchants can decide to display the filter option expand or collapse by default.
7. Save
Steps
  1. 1.
    Go to Online store > Navigation
  2. 2.
    Add the filter options that merchants want to display. There are 6 filter options: Product Type, Availability, Color, Size, Vendor, Price.
3. Save
  • Can change the filter position, title, and height.

Pagination

Enable pagination in 3 ways.
Paging by numbers
Load more button
Infinite scroll