DAWN Breadcrumbs

[Amy200101]

Hey guys,

I am trying to add breadcrumbs to my dawn theme but I would like to change a few things. I would like to show possibly Home - main category - product.

https://www.supplieswarehouse.co.uk/products/himalayan-4314-bounce-black-composite-safety-trainer 

Currently this is what this is what it shows

This item is actually Home - Workwear & Safety - Safety Footwear. Can I change my breadcrumbs to match this?.

Current code is {% if template == 'product' %}
{% assign current_collection = product.collections.first %}
{% if current_collection %}
<nav class="breadcrumb" role="navigation" aria-label="breadcrumbs">
<a href="/" title="Home">Home</a>
<span aria-hidden="true">›</span>
<a href="{{ current_collection.url }}" title="{{ current_collection.title }}">{{ current_collection.title }}</a>
<span aria-hidden="true">›</span>
<span>{{ product.title }}</span>
</nav>
{% endif %}
{% endif %}

Also how do I make this look better in css?.

Thanks

[DitalTek]

Hi,

You can try this code.

{% if template == 'product' %}
	{% assign current_collection = product.collections.first %}
	{% if current_collection %}
	<nav class="breadcrumb" role="navigation" aria-label="breadcrumbs">
	<a href="/" title="Home">Home</a>
	<span aria-hidden="true" style="display:inline-block;padding: 0 8px;">-</span>
	<a href="{{ current_collection.url }}" title="{{ current_collection.title }}">{{ current_collection.title }}</a>
	<span aria-hidden="true" style="display:inline-block;padding: 0 8px;">-</span>
	<span>{{ product.title }}</span>
	</nav>
	{% endif %}
	{% endif %}