Out now! Check out the Poll results: Do you have a Shopify store?
Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

Re: Breadcumbs position

Breadcumbs position

Arashio
Tourist
19 0 2

Hi,

I'm finding my way around editing code in Shopify and have added breadcrumb navigation to Narrative theme. I'm struggling to find where to put the code for padding the breadcrumb. Can anyone help on this issue while I’m using the breadcrumbs code provided by Shopify https://shopify.dev/tutorials/customize-theme-add-breadcrumbs. Even following all the steps, but nothing has been shown in my website.

 

Thanks,

Replies 9 (9)

MT-Sentissi
Excursionist
22 1 2

Maybe, you must to put :  {% include 'breadcumb' %}


Capt 99.png

 

@MT-Sentissi
- Click Like to let me know, if my Reply was helpful!
- "Accept as Solution" if my comments were a help to your question!
Arashio
Tourist
19 0 2

Hi MT,

 

Do you mind looking the below screen captures? I have added the code that you have mentioned. But it comes out it shown on the top left corner where I would like to put it into the blue circled. Can you please advise where should I put the code or how do I adjust it to where I want?

 

A.PNG

 

B.PNGC.PNG

 

MT-Sentissi
Excursionist
22 1 2

Hello
Don't include that on the "theme.liquid"
This must be inserted into the page, "article-template.liquid", "product-template.liquid" blogs, pages...
You can already have it, but it depends on your theme.

 

Capt 101.png

 

@MT-Sentissi
- Click Like to let me know, if my Reply was helpful!
- "Accept as Solution" if my comments were a help to your question!
Arashio
Tourist
19 0 2

Hi MT,

 

Thanks for your advice, should I delete the whole row 7, row 14, row 24 and row 33 directly? I'm currently using narrative theme.

Arashio
Tourist
19 0 2

Hi MT,

 

Also, do you know how where and how could I adjust the breadcrumbs to the middle?

Sub-header 9Jun.PNG

Arashio
Tourist
19 0 2

Hi MT,

 

Do you know how could I move downwards? Am I in the right direction? Should I make the adjustment under theme.liquid? "BEEF" is this a main-content or do you know what this item is?

 

擷取.PNG擷取1.PNG

MT-Sentissi
Excursionist
22 1 2

Stop! Stop! Stop!
My friend you don't need to paste this whole code listed on your "theme.liquid"

First:
You're going to create a "Snippet" that you're going to name "breadcrumb"
In this file you paste the whole code / <style> and<scrypte>....

After that you go to the page you want and has the place of desire and you paste {% include 'breadcrumb' %}

Just:

 

Capt 115.pngCapt 114.pngCapt 116.pngCapt 117.pngCapt 118.png

@MT-Sentissi
- Click Like to let me know, if my Reply was helpful!
- "Accept as Solution" if my comments were a help to your question!
Arashio
Tourist
19 0 2

Hi MT,

Thanks for your advice. I would also like to know how could I move down the breadcrumb close to the "BEEF" title as below.擷取.PNG

 

Thanks so much!

MT-Sentissi
Excursionist
22 1 2

What theme do you use?

@MT-Sentissi
- Click Like to let me know, if my Reply was helpful!
- "Accept as Solution" if my comments were a help to your question!