How To Add Breadcrumb Navigation to your blogger

To add breadcrumb navigation to your blogger so as users can see where they are in your blogger like this:
 Home >Blogger tricks > How To Add Breadcrumb Navigation to your blogger
, you can follow the steps below:

1. Log in to your blogger account
2. Go to Design --> Edit HTML
3. Check  the Expand Widget Templates box
4. Copy the code below,

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

5. Find

]]></b:skin>

6. Paste the code  above .

7. Copy the code below:

<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>

8. find

<div class='post hentry uncustomized-post-template'> 

9. Past the code  above.

10. Save your changes.

NB: change the colored words by your choice

Posted in: Blogger tricks