Customize How Many Products Appear on a Category Page

If you want to increase or decrease the max number of products displayed on category pages, you can do this by editing your theme. By default, our base theme will display a maximum of 12 products per page.

Increasing the number of product cards that render on a page will slow down the page load speed. We recommend setting a number not higher than 25.

Modify Your Theme

1. Check if your theme already has a template with a key of snippets/products/results (look for snippets/products/wrapper if you are using v18 or below)
   1. If so, skip to step 6 and just modify your template using the code snippets shown below.
2. Create a new template in your theme.
3. Give it this key: snippets/products/results
4. Grab the template code for your liquid version from our Base Theme.
   1. Find the correct version for your website
   2. Locate the snippets/products/results template
   3. Copy the code
5. Paste the code in the content field of your new template
6. Edit the code to include the following snippets:

liquid {% assign products_per_page = 24 %}

liquid {% paginate products by products_per_page %}

By default, the number of products displayed per page is determined by the current_search.per_page attribute. To override this, define a new variable with the desired number of products per page.

Your final code would look something like this:

```liquid {% default products: current_search.results.products %} {% default allow_comparisons: false %} {% assign products_per_page = 24 %}

{%- if current_search.count > 0 %} {% paginate products by products_per_page %}

  {% for product in products %}

      {%- cache "product", items: [product, current_store, current_customer] -%}
        {%- render "products/card", product: product, allow_comparisons: allow_comparisons %}
      {%- endcache -%}

  {% endfor %}

{% render 'shared/pagination-nav', paginate: paginate %}   {% endpaginate %}

{%- if allow_comparisons and theme_variables[“products.comparisons”] == true %} {% render “products/comparison_banner” %} {% render “products/screen” %} {%- endif %} {% else %}

{{ "search.products.index.no_results" | t  }}

{% endif %} ```