Hiding Products from Shopify Search Results

 

I have been reading a lot in the Shopify forums about hiding select items from search results.  I tried the suggested code and like others I found that the simple condition that "should have" worked did not.

The recommendation for hiding products via tags, product types, or collections is through the use of (replace collection with your choice attribute) {% unless product.collections contains 'Collection Name' %}  then display the search results via the display code.  This did not work for me and I was able to determine that it was not because of what had been listed as possible causes such as adding the condition to the wrong file, putting it in the wrong place in the file, having multiple locations where it needed to be placed.  It was because contains just does not work.  I added an old-fashioned coding technique to set  flag to true, loop through the collection titles for a product and set it to false if found.  Thereafter if the flag is true then include the product in the search results if not, don't include it.  Here is the code:

Does not work (from search.liquid):

{% if item.object_type == 'product' %}
{% assign product = item %}
{% unless product.collections contains 'Accessories for Options' %}
       {% include 'product-grid-item' %}
{% endunless %}

 Does work (from search.liquid):

{% if item.object_type == 'product' %}
{% assign product = item %}
{% assign display = true %}
{% for collection in product.collections %}
       {% if collection.title == 'Accessories for Options' %}
              {% assign display = false %}
       {% endif %}
{% endfor %}
{% if display == true %}
      {% include 'product-grid-item' %}
{% endif %}

And so there are still problems with this approach.  Pagination is MESSED UP.  And if you have ever worked with pagination you know that is a wild beast to tame.  The better approach is to remove the offending products BEFORE they ever get to the search results.  We can do that.  If you add a tag "options" to the product (you could use a type to identify products to remove as well but for this example we will use tag).

There are two files that need to be changed.

1)  Limit the search results..

Note: while there are a number of different ways to do this I chose this method to prevent ever displaying the added text in the search string from displaying inside the search box. Some methods will quickly flash the added text before transitioning to the search result page.   

In the Snippets folder find search-bar.liquid.  Find the <form tag.  Add the following

<form onsubmit="this.q.value = this.searchtext.value + this.q.value"

Find the <input tag with name="q" replace name="q" with id="searchtext"  replace whatever is set for value= to value=""  (i.e. value should be empty).

Add this line right after <input id="searchtext1" type="hidden" name="q" value= ' and -tag:options'>

 

Also, make sure your input for the 

2)  Ok so now you have the search results right but you don't want to display the newly constructed search term that includes the gobledeeguk.  You want to display only what the customer searched for.  In the templates folder find search.liquid.  

Find the following code

{% if search.performed %}
    {% if search.results_count == 0 %}
       <h1   

inside the h1 tag find the "t: terms: search.terms" and add the remove code including the bar after it..

| t: terms: search.terms | remove: ' and -tag:options'  

There will probably be two (at least) <h1> tags that have the search.terms listed. Add the remove code to all.

 

 


Leave a comment

Please note, comments must be approved before they are published