Shopify Breadcrumbs with Schema

{% unless template == 'index' or template == 'cart' or template == 'list-collections' or template == 'customers/login' or template == 'customers/register' %}

<div class="breadcrumb-block">

<ul class="breadcrumb" role="navigation" aria-label="breadcrumbs" itemscope itemtype="https://schema.org/BreadcrumbList">

<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">

<a title="Home" href="https://example.com.au" itemprop="item">

<span itemprop="name">Home</span>

<meta itemprop="position" content="1" />

</a>

</li>

{% if template contains 'page' %}

<span class="breadcrumb-separator" aria-hidden="true">›</span>

<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">

<a style="color: #666666;" href="{{ page.url }}" itemprop="item">

<span itemprop="name">{{ page.title }}</span>

<meta itemprop="position" content="2" />

</a>

</li>

<!-- PRODUCT -->

{% elsif template contains 'product' %}

{% if collection.url %}

<span class="breadcrumb-separator" aria-hidden="true">›</span>

<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">

<a href="{{collection.url }}" itemprop="item">

<span itemprop="name">{{ collection.title }}</span>

<meta itemprop="position" content="2" />

</a>

</li>
{% unless collection.url %}

<span class="breadcrumb-separator" aria-hidden="true">›</span>

<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">

<a style="color: #666666;" href="{{ product.url }}" itemprop="item">

<span itemprop="name">{{ product.title }}</span>

<meta itemprop="position" content="3" />

</a>

</li>
{% endunless %}

<span class="breadcrumb-separator" aria-hidden="true">›</span>

<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">

<a style="color: #666666;" href="{{ product.url }}" itemprop="item">

<span itemprop="name">{{ product.title }}</span>

<meta itemprop="position" content="3" />

</a>

</li>

{% endif %}
<!-- COLLECTION -->

{% elsif template contains 'collection' and collection.handle %}

<span class="breadcrumb-separator" aria-hidden="true">›</span>

{% if current_tags %}

{% capture url %}/collections/{{ collection.handle }}{% endcapture %}

<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">

<a style="color: #666666;" href="{{ collection.url }}" itemprop="item">

<span itemprop="name">{{ collection.title}}</span>

<meta itemprop="position" content="2" />

</a>

</li>

<span aria-hidden="true">›</span>

{{ current_tags | join: " + " }}

{% else %}

<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">

<a style="color: #666666;" href="{{ collection.url }}" itemprop="item">

<span itemprop="name">{{ collection.title}}</span>

<meta itemprop="position" content="2" />

</a>

</li>

{% endif %}
<!-- BLOG -->

{% elsif template == 'blog' %}

<span class="breadcrumb-separator" aria-hidden="true">›</span>

{% if current_tags %}

<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">

<a style="color: #666666;" href="{{ blog.url }}" itemprop="item">

<span itemprop="name">{{ blog.title}}</span>

<meta itemprop="position" content="2" />

</a>

</li>

<span class="breadcrumb-separator" aria-hidden="true">›</span>

{{ current_tags | join: " + " }}

{% else %}

<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">

<a style="color: #666666;" href="{{ blog.url }}" itemprop="item">

<span itemprop="name">{{ blog.title}}</span>

<meta itemprop="position" content="2" />

</a>

</li>
{% endif %}
<!-- ARTICLE -->

{% elsif template == 'article' %}

<span class="breadcrumb-separator" aria-hidden="true">›</span>

<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">

<a href="{{ blog.url }}" itemprop="item">

<span itemprop="name">{{ blog.title}}</span>

<meta itemprop="position" content="3" />

</a>

</li>

<span class="breadcrumb-separator" aria-hidden="true">›</span>

<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">

<a style="color: #666666;" href="{{ article.url }}" itemprop="item">

<span itemprop="name">{{ article.title}}</span>

<meta itemprop="position" content="3" />

</a>

</li>

{% else %}

<span class="breadcrumb-separator" aria-hidden="true">›</span>

<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">

<a style="color: #666666;" href="{{ page.url }}" itemprop="item">

<span itemprop="name">{{ page_title}}</span>

<meta itemprop="position" content="3" />

</a>

</li>

{% endif %}
</ul></div>

{% endunless %}