Filter only available products while using pagination

Highlighted
Tourist
7 0 0

Hello. I had a problem that a lot of people seemed to had, and, as I wasn't able to find the answer I fixed it myself and I am sharing the answer.

I had pagination enabled, plus I wanted to hide the unavailable products. It is done like so.

In the collection-template.liquid, change:

{% paginate collection.products by 20 %}

For

{% paginate collection.products | where: "available", true by 20 %}

Then, locate the loop:

{% for product in collection.products %}
{% assign featured = product %}
<div class="grid__item {{grid_item_width}}">
{% include 'product-grid-item' %}
</div>
...

And replace it for:

{% for product in collection.products %}
{% if product.available == true %}
{% assign featured = product %}
<div class="grid__item {{grid_item_width}}">
{% include 'product-grid-item' %}
</div>
{% endif %}

0 Likes