CODEWITHSUNDEEP
shopify
Shara Karasic
Shara Karasic

Reputation: 35

How can I check which collection/product tag URL a user came from and then use that in a conditional statement?

I created breadcrumb code for my client's Shopify site that displays

collection >> product tag >> product

For example:

tableware >> plates >> yellow-striped plates

We use product tags to create subcategories. The only scenario where this breadcrumb doesn't work is when one product is tagged for two different subcategories under a collection. So for example, we have the collection "party favors", and that has as subcategories (product tags) "girls favors" and "boys favors". Wooden spinning tops is tagged both "girls favors" and "boys favors". So when going through the array, "boys favors" comes up first and displays on the product page both when user comes from the girls favors subcategory and the boys favors subcategory. I can't use a remove to remove "boys favors" as that will remove it for the boys favors product page as well.

Is there a way my breadcrumb.liquid page can know which collection/producttag URL a user came from, and then can I take that info and make a variable I can create conditional code around to display the correct product tag (in a case where the same product has two different product tags representing two subcategories under the same collection)?

Upvotes: 0

Views: 1523

Answers (1)

HymnZzy
HymnZzy

Reputation: 2925

Shopify doesn't store variable data. It renders the page solely based on the URL. You can use a combination of JS and liquid code to get this working

  1. In your collection.liquid template or product-block.liquid snippet find a tag that is linked to product.
  2. Just before closing of the href attribute add this code {% if current_tags %}#{{ current_tags }}{% endif %}
  3. In your theme.liquid layout, right before <\head> add this line <script>var c_tag = decodeURI(window.location.hash)</script>
  4. In your breadcrumbs related code, give an id to the particular breadcrumb. Let's say in your example: <span id='r_tag'>boys favors >></span>.

  5. Right after that span add this:

    <script>if(c_tag == null || c_tag == $('#r_tag').innerHTML.replace(' &gt;&gt;','')){} else { $('#r_tag').innerHTML = c_tag + ' >>' }</script>

Please note that if there are more than 1 current_tags you'd have to modify the code accordingly.

Upvotes: 1

Related Questions