Shopify themes, liquid, logos, and UX
Hello!
I added collection filter dropdown menus following this tutorial. The problem is that when I use a filter in a collection the rest of the posible filter values dissapear. Here are some snippets to see what I mean:
I was wondering would it be possible that all of the available tags within this collection stays in this dropdown e.g. in second snippet the "SV650" product tag still would be visible? It just seems a bit weird that I need to select "All" and then the "SV650" tag to filter only products with this tag. Hope you understood my problem!
Page preview available here.
Thanks in advance!
Regards,
Kuciks
Solved! Go to the solution
This is an accepted solution.
Okay so I managed to fix this problem. If anyone else has this problem and you follow the tutorial I mentioned above. In coll-filter class:
<div class="four-columns">
<p>Category:</p>
<select class="coll-filter">
<option value="">All</option>
{% for tag in collection.tags %}
{% if tag contains 'category-' %}
{% assign tagName = tag | remove: 'category-' %}
{% if current_tags contains tag %}
<option value="{{ tag | handle }}" selected>{{ tagName }}</option>
{% else %}
<option value="{{ tag | handle }}">{{ tagName }}</option>
{% endif %}
{% endif %}
{% endfor %}
</select>
</div>
In line where is the for loop: "{% for tag in collection.tags %}" you should use attribute .all_tags and it fixes this problem
Hello again! So is this doable by myself or I should be considering hiring a Shopify professional to do this?
This is an accepted solution.
Okay so I managed to fix this problem. If anyone else has this problem and you follow the tutorial I mentioned above. In coll-filter class:
<div class="four-columns">
<p>Category:</p>
<select class="coll-filter">
<option value="">All</option>
{% for tag in collection.tags %}
{% if tag contains 'category-' %}
{% assign tagName = tag | remove: 'category-' %}
{% if current_tags contains tag %}
<option value="{{ tag | handle }}" selected>{{ tagName }}</option>
{% else %}
<option value="{{ tag | handle }}">{{ tagName }}</option>
{% endif %}
{% endif %}
{% endfor %}
</select>
</div>
In line where is the for loop: "{% for tag in collection.tags %}" you should use attribute .all_tags and it fixes this problem
I have three filter shown at the header, but when I use the filter, it turns out there is no product in this collection. Do you know why?
Thank you in advanced.
User | RANK |
---|---|
182 | |
150 | |
80 | |
72 | |
61 |
Explore the 30-30-30 rule, a dynamic social media strategy for new businesses. Learn how t...
By Trevor Sep 20, 2023Discover how to leverage the often overlooked footer of your ecommerce site to gain custom...
By Skye Sep 15, 2023In this blog, we’ll be shining a light on Shopify Partners, Experts, and Affiliates. Who a...
By Imogen Sep 13, 2023