skip to Main Content

I want to add breadcrumbs to new shopify eshop according to this Liquid code example. Problem is that collection object is empty when I am on product page (case {%- when 'product' -%}).

Console log in this case returns undefined:

...
{%- when 'product' -%}
  <script>console.log({{ collection | json }});</script>
  {%- if collection.url -%}
    <li class="breadcrumbs__item">
      {{ collection.title | link_to: collection.url }}
    </li>
  {%- endif -%}
  <li class="breadcrumbs__item">
    <a class="breadcrumbs__link" href="{{ product.url }}" aria-current="page">{{ product.title }}</a>
  </li>
{%- when 'collection' and collection.handle -%}
...

I use conditional collections and product is usually in multiple collections.

2

Answers


  1. Yes collection objetc is empty when you’re in the product page. What collection do you need?

    If you need any collection that contains the current product you can do

    {% assign collection = product.collections.first %}
    

    And then you will have the collection assigned to the collection variable.

    Login or Signup to reply.
  2. Be careful if you’re adding <script>console.log('log')</script> inside the a capture tag, in my case I removed those and it solved my strip issue.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search