Tutorial Membuat Breadcrumb Navigation pada Blog

Breadcrumb Navigation merupakan sebuah script yang berfunsi untuk memudahkan pembaca mengetahui kategori dan sub kategori artikel/postingan yang sedang dibaca. Pemasangan breadcrumb ini juga disarankan oleh search engine google untuk optimasi blog Anda.

Seperti apakah cara membuat breadcrumb di blog? Ikuti dan simak langkah-langkahnya berikut ini:

Langkah-Langkah

1. Login akun blogger Anda.
2. Pilih Template > Edit HTML > centang Expand Template Widget.
3. Cari kode ]]></b:skin> (Gunakan F3 atau Ctrl + F).
4. 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;
}

5. Kemudian letakkan juga kode berikut dibawah kode <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> »
<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>
»
</b:if>
<data:post.title/>
</div>
</b:if>

Langkah selanjutnya yaitu simpan pekerjaan anda dan lihat hasilnya. Untuk Breadcrumb pada blog saya bisa dilihat gambar dibawah ini.

Breadcrumb Navigation

Sekian postingan dari kami semoga artikel ini dapat berguna bagi pembaca khususnya para sobat blogger semuanya.