I need help with the availability filter

Store Design
1

So basically right now, if a product has variants and at least one variant is out of stock then the whole product will be connected to the out of stock option in the availability filter. I want a product to be out of stock in the filters only if all variants are out of stock. How do I change this? I’m using horizon theme.

2

Are you using the search and discovery app??

3

Yes‎‎‎‎‎‎‎‎‎ ‎‎ ‎ ‎ ‎ ‎

4

Great thanks. So the behaviour i am seeing now is as you explained even if one variant is out of stock it does list the product as out of stock but it actually displays the first variant within the product that is out of stock. But i do realize that this can be misleading to the users, as it does display the image but does not show in any way that only a variant is out of stock and not all variants are.

This will though will need looking up and add a check before rendering all the products. Will update you on this.

Best

5

You can’t.
Search and Discovery tries to work on the variant level here.

The workaround though is to set up a Flow which will fire on “Product variant out of stock/back in stock”, check other variants and set a metafield on this product, like “completely_sold” to true/false.

Then you can add this metafield to filters in S&D app and use it for filtering instead of default availability field.

6

So i do kind of have a solution here but it is kind of a workaround but works well. You should definitely look to the solution @tim_tairli mentioned. So what i am doing is checking if the filter is set to out of stock, if it is i am looking to all variants of a product and if even one is available i remove that product from the list of out of stock items. We dont need to worry about in stock lists because shopify handles that well, if any variant is available the product is shown in the list.

In your main-collection.liquid file around line 72 replace the code from the statement which says {% paginate collection.products by 24 %} to {% endpaginate %} around line 95 with this code below.

{% paginate collection.products by 24 %}

  {% capture children %}

    {% for product in collection.products %}


      {% assign show_product = true %}


      {%- comment -%}

      Check if Availability filter is active and set to "Out of stock"

      {%- endcomment -%}


      {% assign out_of_stock_filter_active = false %}


      {% for filter in collection.filters %}

        {% if filter.label == 'Availability' and filter.active_values.size > 0 %}

          {% for value in filter.active_values %}

            {% if value.label == 'Out of stock' %}

              {% assign out_of_stock_filter_active = true %}

            {% endif %}

          {% endfor %}

        {% endif %}

      {% endfor %}


      {%- comment -%}

      Only apply custom variant logic if "Out of stock" filter is active

      {%- endcomment -%}


      {% if out_of_stock_filter_active %}


        {% assign all_variants_sold_out = true %}


        {% for variant in product.variants %}

          {% if variant.available %}

            {% assign all_variants_sold_out = false %}

          {% endif %}

        {% endfor %}


        {%- comment -%}

        If ANY variant is available → hide product from Out of stock view

        {%- endcomment -%}


        {% unless all_variants_sold_out %}

          {% assign show_product = false %}

        {% endunless %}


      {% endif %}


      {% if show_product %}

        <li

          id="{{ section.id }}-{{ product.id }}"

          class="product-grid__item product-grid__item--{{ forloop.index0 }}"

          data-page="{{ paginate.current_page }}"

          data-product-id="{{ product.id }}"

          ref="cards[]"

        >

          {% content_for 'block', type: 'product-card', id: 'product-card', closest.product: product %}

        </li>

      {% endif %}


    {% endfor %}

  {% endcapture %}


  {% render 'product-grid',

    section: section,

    children: children,

    products: collection.products,

    paginate: paginate

  %}

{% endpaginate %}

Always keep a backup of the working theme, so even though any code changes works updates might hamper it. So always keep a backup of the working theme.

Best