How to Hide Products From Shopify Store Search Without Using Apps

Categories
Website Development

I walk you through how to hide products from Shopify search results using customer tags and product templates.

A low level of Liquid knowledge is recommended for the following guide.


Most Shopify store owners want customers to find the products they’re looking for – that is, after all, the whole point of having a search function.

Sometimes, though, you don’t want customers to see every product, or you want certain customers to only see certain products.

For example, I recently added a wholesale section to a client’s store (which ordinary customers couldn’t access), but wholesale products were still coming up in the search results.

In this article, I’m going to walk you through how to hide certain products from certain customers in Shopify search results, using customer tags and product templates.

Step 1: Create custom templates and customer tags

Before we get started, we need to actually get the product templates and customer tags set up.  Rather than explaining it in detail here, I’m going to direct you to this excellent tutorial by Leighton Taylor of Envision.  Follow steps 1-5, and come back here when you’re done.

Step 2: Go to search.liquid

Now that you’ve set up your product templates and customer tags, go to Main Menu Online Store Themes > Next to your live theme, click Actions > Select Edit code from the drop-down menu > From the list of code files on the left-hand side, click Templates > Under Templates, you should find a file called search.liquid (or something similar).

Step 3: Add in the code

This is where it starts to get a little more complex.

Start by scrolling down until you find a line of Liquid code (it should be purple) that looks like this:

{% if search.performed %}

Shortly below, you should find another line of Liquid code:

{% for item in search.results %}

Below that, you’ll find a big chunk of code that looks similar to this (it will vary from theme to theme).  For reference, this is from a 2019 version of Brooklyn.

{% if item.object_type == 'product' %}
{% assign product = item %}
{% include 'product-grid-item' %}
{% else %}
<div class="grid__item grid-search large--one-third medium--one-half">
<div class="grid-search__page">
<a href="{{ item.url }}" class="grid-search__page-link">
<span class="grid-search__page-content">
<span class="h4 text-center">{{ item.title }}</span>
{{ item.content | strip_html | truncatewords: 60 }}
</span>
</a>
</div>
</div>
{% endif %}

The above code (let’s call it Code Chunk 1) is essentially saying that if the item displayed in the search result is a ‘product’ (versus, say, an article or a page), then Shopify should pull in the product-grid-item.liquid snippet, which is the code used to display products within collections.  The name will vary from theme to theme, so don’t stress if it’s not identical.

Code Chunk 1 then goes on to say how to display the item if it’s an article or a page instead of a product.  What we’re going to do is duplicate that code for our wholesale customers and our regular customers, using Liquid’s conditional if/else control flow tags.

Here’s the full code – you’ll need to amend it unless you’re using a 2019 Brooklyn theme.

{% if customer.tags contains 'wholesale' %}

{% if item.object_type == 'product' %}
{% assign product = item %}
{% include 'product-grid-item' %}
{% else %}
<div class="grid__item grid-search large--one-third medium--one-half">
<div class="grid-search__page">
<a href="{{ item.url }}" class="grid-search__page-link">
<span class="grid-search__page-content">
<span class="h4 text-center">{{ item.title }}</span>
{{ item.content | strip_html | truncatewords: 60 }}
</span>
</a>
</div>
</div>
{% endif %}

{% else %}

{% if item.object_type == 'product' %}
{% assign product = item %}
{% unless product.template_suffix contains 'wholesale' %}
{% include 'product-grid-item' %}
{% endunless %}
{% else %}
<div class="grid__item grid-search large--one-third medium--one-half">
<div class="grid-search__page">
<a href="{{ item.url }}" class="grid-search__page-link">
<span class="grid-search__page-content">
<span class="h4 text-center">{{ item.title }}</span>
{{ item.content | strip_html | truncatewords: 60 }}
</span>
</a>
</div>
</div>
{% endif %}

{% endif %}

This might seem complex, but it’s actually relatively easy.  Firstly, find your version of Code Chunk 1 (it starts with {% if item.object_type == ‘product’ %} and ends with {% endif %}).

Then, place it in between these two tags: {% if customer.tags contains ‘wholesale’ %} and {% endif %}.

If you hit Save right now, your regular customers won’t see any search results at all, and customers tagged with ‘wholesale’ will see the normal search results.

To change this, we’re going to copy Code Chunk 1, and paste it after the original – let’s call them Code Chunk 1.0 and Code Chunk 2.0 respectively.

Between Code Chunks 1.0 and 2.0, place an {% else %} tag.  If you hit Save now, both regular and wholesale customers would see the same, ordinary search results.

In Code Chunk 2.0, find this part:

{% if item.object_type == 'product' %}
{% assign product = item %}
{% include 'product-grid-item' %}
{% else %}

Before and after the call to include product-grid-item.liquid, place these two lines: {% unless product.template_suffix contains ‘wholesale’ %} and {% endunless %}.

Now you’ve ensured that if any products using the product.wholesale.liquid template are shown in the results, regular customers won’t see them.

Theoretically, you can repeat this process using different product templates and different customer tags by virtue of the Liquid if, elseif, else control flow tags.  You could use this to have different VIP collections, wholesale collections, and so on.

If you have any questions about how to hide products from a Shopify store search (like how to apply this to another free Shopify theme), email me at service@chevronediting.com.au.

For Minimal 2020

In your theme files, go to Templates > search.liquid, and replace the following code:

{% for item in search.results %}
{% include 'search-result' %}
<hr>
{% endfor %}

With this code:

{% for item in search.results %}
{% if customer.tags contains 'wholesale' %}
{% include 'search-result' %}
{% else %}
{% unless item.tags contains 'wholesale' %}
{% include 'search-result' %}
{% endunless %}
{% endif %}
<hr>
{% endfor %}

 

By Duncan Croker

Duncan is a copywriter with a background in editing and storytelling. He loves collaborating with brands big and small, and thrives on the challenges of hard marketing.

Leave a Reply

Your email address will not be published. Required fields are marked *