Sunday, February 6, 2011

Add Breadcrumb Navigation in Blogger

Breadcrumb navigation? What is breadcrumb navigation? Definition of breadcrumb :
Breadcrumbs or breadcrumb trail is a navigation aid used in user interfaces. It gives users a way to keep track of their location within programs or documents. - Wikipedia.

Breadcrumb navigation looks something like this :


Do you like it? Wanna add Breadcrumb in your blog? Let's do it.

1. Go to your Dashboard >> Design >> Edit HTML >> Check Expand Widget Templates.

2. Search this code (Ctrl + F), ]]></b:skin>

3. Add the code below, just before the ]]></b:skin>
.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:95%;
line-height: 1.4em;
border-bottom:3px double #333333;
}

4. Now search this code (Ctrl + F),
<b:include data='top' name='status-message'/>

5. Replace it with this code,
<b:include data='top' name='status-message'/>
<b:include data='posts' name='breadcrumb'/>

6. Then, find this code,
<b:includable id='main' var='top'>

7. Replace it with this code.

8. Save your template and DONE!

Also, this hack is good for your blog SEO. Enjoy this Breadcrumb Navigation.


Ditulis Oleh : silent screamer // 5:40 AM
Kategori:

0 comments:

Post a Comment

 

Followers

Sponsor

 
Powered by Blogger.