How to Add BreadCrumbs in Blogger?
May 25, 2023 ・0 comments ・Topic： Blogger
Hello!
Dear friends my name is ARYA KHAN today I am going to show you! how to add breadcrumbs in blogger sites or blogs.
Blogger breadcrumbs are very useful & beautiful looks in our blog, it’s very helpful for the visitor it show where the users navigate in blogs or websites, and it is especially helpful for e-commerce and business websites. If your site has lots of categories sub-categories and pages I suggest you breadcrumbs are very helpful for you. Not only use it for the business website you can use breadcrumbs is your blog.
The benefits of adding breadcrumbs to a blog or website, increase your page views, it improves your website or blog's internal links. Breadcrumbs is one of the internal linking SEO strategy also category, pages, latest posts, recent posts, and related posts so you can definitely use this element on your websites or blogs.
steps:
Let’s see the breadcrumbs-adding option. Go to the Blogger Dashboard then go to Template/Theme then go to Edit HTML then find the below code.
Code:
<div class='blog-posts hfeed'>
Or
<b:includable id='post' var='post'>
Breadcrumbs code is placed below the upper code, breadcrumbs code is below.
Code:
<!--breadcrumbs start-->
<b:if cond='data:blog.pageType == "item"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == true'> »
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
</b:loop>
<b:else/>
» Unlabelled
</b:if>
» <span><data:post.title/></span>
</b:loop>
</span>
</p>
</b:if>
<b:if cond='data:blog.pageType == "static_page"'>
<p class='breadcrumbs'>
<a expr:href='data:blog.homepageUrl'>Home</a> » <data:blog.pageName/>
</p>
</b:if>
<b:if cond='data:blog.pageType == "archive"'>
<p class='breadcrumbs'>
<a expr:href='data:blog.homepageUrl'>Home</a> » <data:blog.pageName/>
</p>
</b:if>
<b:if cond='data:blog.searchLabel'>
<p class='breadcrumbs'>
<a expr:href='data:blog.homepageUrl'>Home</a> » <data:blog.pageName/>
</p>
</b:if>
<!--breadcrumbs end-->
Now breadcrumbs have been enabled in your blogs or websites, Let’s enjoy.
Post a Comment
Please do not enter any spam link in the comment box.
If you have any doubts, Pease let me know.
If you can't commemt, try using Chrome instead.