Hide out of stock products from search without blanks

Excursionist
25 0 5

Out of stock items are only visible on my shopify via search or a direct link to the product. For SEO reasons I am leaving those products published, as I do not want a ton of 404 errors. 

 

I am trying to find a smart way to prevent products that are out of stock from showing up when a customer uses search. From reading many other forum posts about this same topic it seems the best solution still causes issues...in that it does not show out of stock products, but skips them and causes blanks. As an example, if a customer searches for Christmas fabric on our website and we have 50 products that match that search but only 30 products that have stock then we will have 20 blanks in the display. 

 

Is there no smarter way to code this? Is there a way to code the search.liquid so that it only shows products in stock that match the search without causing blanks? Similar to how it would work if I had deleted those products and then the customer performed a search?

 

Here is my current search.liquid, any thoughts on how I would change this to hide out of stock products?

{% assign search_pagination = settings.pagination_limit %}
{% paginate search.results by search_pagination %}

<div class="sixteen columns clearfix collection_nav">
  <h1 class="collection_title {% if search.performed %}collection_title_tags{% endif %}">{{ 'general.search.title' | t }}</h1>
  {% if search.performed %}
    <ul class="collection_menu">
      <li>
        {{ 'general.search.results_count' | t: count: search.results_count }}
      </li>
    </ul>    
  {% endif %}
</div>

{% if search.performed %}
  
  {% if search.results == empty %}    
    <br class="clear" />
    <br class="clear" />
    <div class="clearfix">    
      <p class="quote">{{ 'general.search.no_results_html' | t: terms: search.terms }}</p>   
    </div>

    <br class="clear" />
    <br class="clear" />
    <br class="clear" />
  {% else %}  


 {% if settings.search_option == 'everything' or search.results.first.price == blank %}
    {% if settings.collection_sidebar %}
      {% include 'sidebar' %}
      <div class="twelve columns">
    {% else %}
      <div class="sixteen columns">
    {% endif %}


    {% for item in search.results %}
      <div class="product_row">
        
        {% if item.featured_image %}
          <div class="four columns alpha">
             <a href="{{ item.url }}" title="{{ item.title | escape }}">
               <img src="{{ item.featured_image | product_img_url: 'large' }}"  alt="{{ item.title | escape }}" />
             </a>
          </div> 
        {% endif %}
        
        {% if settings.collection_sidebar %}
          <div class="{% if item.featured_image %}eight{% else %}twelve{% endif %} columns omega align_left">
        {% else %}
          <div class="{% if item.featured_image %}twelve{% else %}sixteen{% endif %} columns omega align_left">
        {% endif %}        

          <p>
            <a href="{{ item.url }}" title="{{ item.title | escape }}">{{ item.title }}</a>
          </p> 

          {% if item.price %}
             <div class="info">                                              
                <span class="price">
                  {% if item.compare_at_price_max > item.price %}
                    <span class="was_price">{{ item.compare_at_price_max | money }}</span>
                  {% endif %}
                    
                  {% if item.available %}
                    {% if item.price_varies %}
                      {% if item.compare_at_price_max > item.price %}
                        <br />
                      {% endif %}
                      <small><em>{{ 'products.general.from' | t }}</em></small>
                    {% endif %}
                    {{ item.price_min | money }}
                  {% else %}
                    {{ item.price_min | money }} - {{ 'products.product.sold_out' | t }}
                  {% endif %}
                </span>
            </div>
          {% endif %}
          
          <p>
            {{ item.content | strip_html | truncatewords: 40 | highlight: search.terms | replace: 'Description', '' | replace: 'Specs', '' | replace: 'Shipping', '' }}
          </p>         
        </div>
      </div>  
    <hr />  
   {% endfor %}  
  </div>

 {% else %}
      {% if settings.collection_sidebar %}
        {% include 'sidebar' %}
        <div class="twelve columns">
      {% else %}
        <div class="sixteen columns">
      {% endif %}

      {% assign products = search.results %}
      {% assign products_per_row = settings.products_per_row %}
      {% include 'product-loop' with settings.collection_sidebar %}

      </div>

    {% endif %}
  {% endif %}

  {% include 'pagination' %}    

{% else %}
  <div class="clearfix search_page">  
    <br class="clear" />
    <br class="clear" />   
    <div class="ten columns offset-by-three columns center">
      <p class="quote">
        {{ 'general.search.description' | t }}
      </p>
    </div>    
      <form class="search" action="/search">
        <div class="four offset-by-five columns center">
          {% if settings.search_option != 'everything' %}
            <input type="hidden" name="type" value="product" />
          {% endif %}
          <input type="text" name="q" placeholder="{{ 'general.search.placeholder' | t }}" value="{{ search.terms }}" x-webkit-speech autocapitalize="off" autocomplete="off" autocorrect="off" />

      </div>
      <div class="two columns">
        <input type="submit" name="submit" class="action_button" value="{{ 'general.search.submit' | t }}" style="margin-top:0" />
      </div>
      </form>
    </div>
  </div>
{% endif %}
{% endpaginate %}
0 Likes
Shopify Partner
139 2 12

Hi,
You need to add condition like 

{% for item in search.results %}
  {% if item.object_type == 'product' and item.available == true %}
 // here code stuffs displaying available products
{% endif %}
{% endfor %}



0 Likes