How to Add BreadCrumbs in Blogger Site's
Hello!
Dear friends my name is ARYA KHAN today I am going to show you! how to add breadcrumbs in blogger bites or blogs.
Blogger breadcrumbs is very useful & beautiful looks in our blog, it’s very helpful for the visitor’s it show where the users navigates in blogs or websites, it especially helpful for e-commerce and business websites. If your site has lost of categories sub-categories and pages I suggest you breadcrumbs is very helpful for you. Not only use for business website you can use breadcrumbs is your blog.
Benefits of adding breadcrumbs in blog or website, increase your page views, it improve your websites or blogs internal links. Breadcrumbs is one of the internal linking SEO strategy also category, pages, latest posts, recent posts and related posts so definitely you can use this element on your websites or blogs.
steps:
Let’s see the breadcrumbs adding option. Go to the Blogger Dashboard than go to Template/Theme than go to Edit HTML than find the below code.
Code:
<div class='blog-posts hfeed'>
Breadcrumbs code is placed below of 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 has enable in your blogs or websites, Let’s enjoy.
