show category also in breadcrumbs

Site URL: https://www.lonniwong.com/home

Hello, 

i was wondering if it is possible to also show the shop category in the product page.
At the moment it looks like this: 
I would also like to communicate Shop > Thoughful > Urn

Does this makes sense?  

This is not possible. You need to use a 3rd party plugin. See this: https://sf.digital/breadcrumbs-extension

You can also consider adding breadcrumb on Additional Info on each product, then we can give code to move it to current breadcrumb.

1 hour ago, tuanphan said:

This is not possible. You need to use a 3rd party plugin. See this: https://sf.digital/breadcrumbs-extension

You can also consider adding breadcrumb on Additional Info on each product, then we can give code to move it to current breadcrumb.

mhhh... i see. That is pity.

Ok. and the second option you meant by adding breadcrumb on additional info: Can i try this with your code pls? would like to see if that is an option. 

thank you!

19 hours ago, LonniWong said:

mhhh... i see. That is pity.

Ok. and the second option you meant by adding breadcrumb on additional info: Can i try this with your code pls? would like to see if that is an option. 

thank you!

With option 2, you will need to do this for all products.

You can add it for a product, then share link to it, then we can give the code to move it from additional to current breadcrumb position

12 hours ago, tuanphan said:

With option 2, you will need to do this for all products.

You can add it for a product, then share link to it, then we can give the code to move it from additional to current breadcrumb position

hello @tuanphan
you mean like so? 
https://www.lonniwong.com/shop/p/v23kw4uajanonhjutqod1ulk9dv96j

i have just edited this on one example .

On 9/12/2022 at 2:48 AM, LonniWong said:

hello @tuanphan
you mean like so? 
https://www.lonniwong.com/shop/p/v23kw4uajanonhjutqod1ulk9dv96j

i have just edited this on one example .

Hi,

I don't see anything in Additional Info. Can you check it again?

You can add a Text Block, then enter something like this

Shop > Category Name > Product Name

Then we will give code to replace current breadcrumb with the text you entered.

ok, like so ?

that is the link: https://www.lonniwong.com/shop/p/v23kw4uajanonhjutqod1ulk9dv96j

6 hours ago, LonniWong said:

ok, like so ?

that is the link: https://www.lonniwong.com/shop/p/v23kw4uajanonhjutqod1ulk9dv96j

Yes. But it should be text link, not static text

12 hours ago, tuanphan said:

Yes. But it should be text link, not static text

oh ok, thank you, didnt know. like so?
Im not sure if this is correct. its a link to shop itself...

https://www.lonniwong.com/shop/p/v23kw4uajanonhjutqod1ulk9dv96j

 

It should be Shop (link to shop) > Thoughtful (link to thoughtful category page) > Fame of emotions (no link or link to fame of emotions page)

Add this to Last Line in Settings > Advanced > Code Injection > Footer to move it to current breadcrumb

<script>
  $(document).ready(function() { 
		$('section.ProductItem-additional .html-block').appendTo('nav.ProductItem-nav');
	});
</script>
<style>
  .ProductItem-nav-breadcrumb {
    display: none !important;
}
</style>

😃 @tuanphan that is amazing! now the one issue is the mobile version as it is now in the header area.
so it is not possible to click that.

And design wise it has to be underline, has it or is that possible to not display the underlines? (shop and thoughtful) Or with same font?

Thank you for your help! 

I see now even without the breadcrumb in mobile version the pictures start right directly after the header...


Is it possible to lower that in shop anyways for the mobile view?