Dynamic link to hide out of stock

Solved
Highlighted
Tourist
10 1 5

have the below code in my shopify site, currently all it does is display a link to either 'in stock' or 'Show All'. I would like to make the link more dynamic so if someone has filtered by a certain product and they click on the "in stock" link it would show only in stock for that product. eg. if they were at /collections/all/Product1 after clicking the link it should go to /collections/in-stock/Product1

My Current code:

 

<div class="filter-stock">
{% if page_title contains "Products" %}
            <a href="/collections/in-stock"><b>Hide 'Sold Out' items</b></a>
{% endif %} 
{% if page_title contains "IN STOCK" %}
            <a href="/collections/all"><b>Show All Products</b></a>
{% endif %}

 

0 Likes
Highlighted
Tourist
10 1 5

Ok if have managed to get it working using this code, unless anyone has a better way but it seems to work well now.

<div class="filter-stock">
{% if current_tags %}
    {% for tag in current_tags %}
	{% if page_title contains "IN STOCK" %}
                <a href="/collections/all/{{ tag | handleize }}"><b>Show All Products</b></a>
	{% else %}
                <a href="/collections/in-stock/{{ tag | handleize }}"><b>Hide 'Sold Out' items</b></a>
	{% endif %}
    {% endfor %}
{% endif %}
</div>
0 Likes
Highlighted
Tourist
10 1 5

This is an accepted solution.

new updated code:

<div class="filter-stock">
    {% if current_tags %}
        {% for tag in current_tags %}
            {% if collection == blank or collection.handle != 'in-stock' %}
                <a href="/collections/in-stock/{{ tag | handleize }}"><b>Hide 'Sold Out' items</b></a>
            {% endif %} 
            {% if collection and collection.handle == 'in-stock' %}
                <a href="/collections/all/{{ tag | handleize }}"><b>Show All Products</b></a>
            {% endif %}
        {% endfor %}
    {% else %}
        {% if collection == blank or collection.handle != 'in-stock' %}
            <a href="/collections/in-stock"><b>Hide 'Sold Out' items</b></a>
        {% endif %} 
        {% if collection and collection.handle == 'in-stock' %}
            <a href="/collections/all"><b>Show All Products</b></a>
        {% endif %}
    {% endif %}
</div>
0 Likes
Highlighted
New Member
1 0 0

Where do we paste this code? 

0 Likes
Highlighted
Tourist
10 1 5

Hi AnnaMae, for my template it is located in the "/sections/collection-template.liquid" but yours might be different.  there is also a bit more to it.  I have a collection called "in-stock" which is an automatic collection of inventory stock > 0.  also the below code in my CSS section but yours may be different.

  .filter-stock {
    width: 50%;
    @include flexbox();
    @include align-items(center);
    @media only screen and (max-width: 1199px) {
      @include flex-direction(column);
      @include align-items(flex-start);
    }
    @include respond-to('medium') {
      width: 100%;
      margin-bottom: 20px;
      align-items: center;
      &:last-child {
        margin-bottom: 0;
      }
    }
    label {
      margin-right: 10px;
      white-space: nowrap;
    }
  }