Breadcrumb navigation in Blogger

Just follow the simple steps:

1. Login to Blogger
2. Click Design/Layout
3. Click Edit HTML
4. Click Download Full Template (to backup)
5. Tick Expant Widget template
6. Find the code ]]></b:skin>
7. Copythe following code and paste it above ]]></b:skin>

.breadcrumbs{
padding:5px 5px 5px 0;
margin:0;font-size:95%;
line-height:1.4em;
border-bottom:4px double #cadaef;
}


8. Next, Find this code:
<div class='post hentry uncustomized-post-template'>

9. then copy paste the following code under (below) that code above:

<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>
Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187;
<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != &quot;true&quot;'> , </b:if>
</b:loop>
</b:if> &#187; <data:post.title/>
</div>
</b:if>
</b:if>



10. Save the template
11. Go to check your blog, now you have breadcrumb blog on your blog as a trick to raise your seo blog and enjoy! :)

If you're kind a interested and have a passionate in blogging activity, I highly recommending you to read and having Blogger For Dummies . If you have any question or succeed to put this hack on your blog, please share on comment b

1 comment:

  1. Anonymous10/28/2011

    Aahh this is so sweet!! I've been talking to a couple of different seo companies, and they all mentioned how important this breadcrumbing tool is, but I had no idea how to do it. Until now! Thanks for clarifying. I appreciate it. Take care.

    ReplyDelete

If You Like The Post Or want to Add Something More
then feel free to comment