Hi all, I have tried multiple options but no success with the breadcrumbs. Request you all to help.

Add the following code to the top of your product-template.liquid file: What you need is a collection for each Product Type with the same name as the Product Type so that the link takes the user to the correct collection. You can also style the elements with the classes you have above as you wis…

Hi, Thank you for replying. Yes, I am looking for Home > ProductType > ProductTitle breadcrumb.

Hey, thank you so much, it worked! However, could you please also share details as to how to add padding / spacing? Right now it is sticking to the left corner and to the image at the bottom.

You need to add this code to your theme.css.liquid .breadcrumb{ margin-left: 45px;

You have to insert this code Home / {{ product.vendor }} / {{ product.title}} under this class <div class=“product-template__container page-width” id=“ProductSection-{{ section.id }}” data-section-id=“{{ section.id }}” data-section-type=“product” data-enable-history-state=“true” data-aj…

What if your product pages are built using a 3rd part app like Gem Pages? They have told me that the breadcrumb is part of the header so it won’t work if just added to the produc theme. I’m still abit new to Shopify so any advise would be appreicated. Thanks Antony

Hi, The breadcrumb seems to have some issue on my website. Eg - Home>Collection> Product Whenver I am on the product page, and click the collection part of the breadcrumb, it leads to 404 error. Could you please assist? Link - http://atrangistudio.com/

I actually combined a few of the answers above to get something to work nicely. Add this to product-template.liquid : You can put it in different places. Right under the top first div is common (before the {% comment %}), but I actually put mine after further down on the page, right before the …

I found this bit of code that worked beautifully for me. I also have Debut theme. The only thing I added was: margin-left: 130px; margin-bottom: 15px; I put it within in that first paragrah of code: .breadcrumbs { margin: 0 0 2em; **margin-left: 130px;** **margin-bottom: 15px;** } Hope this h…

Hey, thank you! However, did not quite understand the last three lines. Could you please explain again?

How to add breadcrumbs? Shopify Debut theme

Shopify Discussion

JHKCreate October 13, 2020, 7:39pm 2

Hi @AtrangiStudio !

What format of breadcrumbs are you looking at?

Home > ProductType > ProductTitle

for example?

Topic		Replies	Views
How can I add a collection to my breadcrumb navigation in Debut theme? Store Design	1	43	September 17, 2021
Add breadcrumb menu without app Sense theme Store Design design , collection-page , css , shopify-themes , html , product-page	4	143	April 17, 2024
How can I add a breadcrumb trail to my Craft Theme store? Store Design design , css , shopify-themes , troubleshooting	9	205	November 25, 2024
How can I display navigation based breadcrumbs on my website? Store Design	15	288	March 19, 2024
Add "Shop all: Collection link" and Breadcrumbs navigation above my product page Shopify Discussion	4	116	March 14, 2023

How to add breadcrumbs? Shopify Debut theme

Related topics