FROM CACHE - en_header

Collection filter dropdowns in Minimal

Solved
A_Kuciks
Tourist
10 2 1

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: 

A_Kuciks_0-1597415078662.pngA_Kuciks_1-1597415089951.png

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

Accepted Solution (1)

Accepted Solutions
A_Kuciks
Tourist
10 2 1

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

View solution in original post

Replies 3 (3)
A_Kuciks
Tourist
10 2 1

Hello again! So is this doable by myself or I should be considering hiring a Shopify professional to do this? 

A_Kuciks
Tourist
10 2 1

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

evavava
New Member
1 0 0

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?

evavava_0-1631838209982.png

 

Thank you in advanced.