Cara Membuat dan memasang Navigasi Breadcrumb Di Blogspot

Breadcrumb adalah navigasi menuju artikel. Artinya, urutan navigasi menuju artukel tang sedang dibuka, seperti Browse : Home >> Tips >> Blogging
Breadcrumb adalah salah satu teknik optimasi SEO. Pengunjung bisa kembali pada link yang terdapat pada breadcrumb.

Ya seperti yang saya lingkari itulah yang dinamakan Breadcumb Navigation. Cara ini cukup bermanfaat sebagai penunjuk navigasi untuk pengunjung. Selain itu, Breadcumb Navigation ini bisa digunakan untuk mengoptimalkan halaman blog di search engine (SEO) bahkan ini merupakan rekomendasi dari Google.

Oke cukup reviewnya. Cara membuatnya cukup mudah, oke mari kita buat bersama sama..
1. Login ke blog --> Rancangan --> Edit HTML klik Expand Template Widget untuk memberikan tanda centang pada kotak.
2. Cari kode  <b:if cond='data:post.title'> (gunakan F3 atau Ctrl+F)
3. Letakkan kode berikut dibawah <b:if cond='data:post.title'>

<b:if cond='data:blog.pageType == "item"'>
<div class='breadcrumb'>
<a expr:href='data:blog.homepageUrl' rel='tag'>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 != "true"'>,</b:if>
</b:loop>
&#187;
</b:if>
<data:post.title/>
</div>
</b:if>

Next, mari kita membuat style dari Breadcumb
1. Cari kode ]]></b:skin>
2. Letakkan kode berikut diatas kode ]]></b:skin>

.breadcrumb {
padding:5px 5px 5px 0px;
margin: 0px 0px 10px 0px;
font-size:95%;
line-height: 1.2em;
border-bottom:2px double #000000;
}

Ganti kode yang telah saya beri warna coklat dengan kode yang anda inginkan (sesuaikan dengan blog anda).

Sekian, selamat mencoba dan semoga bermanfaat..