Breadcrumbs with Simple Theme

Deni_Jack
New Member
1 0 0

Hi,

I'm currently using the simple theme and the breadcrumbs don't seem to be right. For instance, if you click on the collection "Dresses" within the collection "Women", the breadcrumbs show Home>Dresses when it should be Home>Women>Dress. My breadcrumb-nav.liquid looks like this:

{% assign t = template | split: '.' | first  %}
<nav class="breadcrumb-nav small--text-center" aria-label="{{ 'general.breadcrumbs.you_are_here' | t }}">
  <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
    <a href="/" itemprop="url" title="{{ 'general.breadcrumbs.home_link_title' | t }}">
      <span itemprop="title">{{ 'general.breadcrumbs.home' | t }}</span>
    </a>
    <span class="breadcrumb-nav__separator" aria-hidden="true">›</span>
  </span>
  {% case t %}
  {% when 'collection' %}
    {% if current_tags %}
      <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
        {% assign collection_url = current_tags.first | link_to_remove_tag: current_tags.first | split: 'href="' | last | split: '"' | first %}
        <a href="{{ collection_url }}" itemprop="url">
          <span itemprop="title">{{ collection.title }}</span>
        </a>
        <span class="breadcrumb-nav__separator" aria-hidden="true">›</span>
      </span>
      {{ current_tags.first }}
    {% else %}
      {{ collection.title }}
    {% endif %}
  {% when 'product' %}
    {% if collection %}
      <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
        <a href="{{ collection.url }}" itemprop="url">
          <span itemprop="title">{{ collection.title }}</span>
        </a>
        <span class="breadcrumb-nav__separator" aria-hidden="true">›</span>
      </span>
    {% endif %}
    {{ product.title }}
  {% when 'blog' %}
    {% if current_tags %}
      <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
        <a href="{{ blog.url }}" itemprop="url">
          <span itemprop="title">{{ blog.title }}</span>
        </a>
        <span class="breadcrumb-nav__separator" aria-hidden="true">›</span>
      </span>
      {{ current_tags.first }}
    {% else %}
      {{ blog.title }}
    {% endif %}
  {% when 'article' %}
    <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
      <a href="{{ blog.url }}" itemprop="url">
        <span itemprop="title">{{ blog.title }}</span>
      </a>
      <span class="breadcrumb-nav__separator" aria-hidden="true">›</span>
    </span>
    {{ article.title }}
  {% when 'page' %}
    {{ page.title }}
  {% else %}
    {{ page_title }}
  {% endcase %}
</nav>

any insight would be appreciated. Thanks!

0 Likes
Xue_L_
Shopify Staff
Shopify Staff
50 0 4

Hello, Deni!

Xue here from the Shopify Team here to help you out.

I compared the navigation code that you've posted to the original snippet in the Simple theme and there doesn't appear to be any changes that have made. In order to look into this further, we'll need to review your set-up, feel free to post your shop URL and we can have a further look, otherwise, let me know if you're more comfortable moving this over to email.

Thanks for posting!

Xue | Shopify Guru

 

0 Likes
Tomas_V
Shopify Partner
2 0 1