Tips Membuat Menu Breadcrumbs di Blog

Menu Breadcrumbs banyak kita jumpai pada blog-blog yang didukung wordpress, akan tetapi menu seperti yang ditunjukkan pada gambar dibawah ini merupakan menu navigasi yang dipasang di blogspot. Banyak kalangan yang menyebut Menu Breadcrumbs ini dengan "breadcrumb-navigation”. Dengan adanya “breadcrumb-navigation” maka pengunjung blog anda dapat dengan mudah melihat posisi postingan serta akan membuat penasaran untuk mencari dan melihat artikel dalam satu kategori.

Bahkan ada pula hal pembuatan breadcrumb-navigation menjadi salah satu penunjang SEO Friendly.



Cara membuatnya gak terlalu ribet, seperti ini caranya....

• Masuk ke akun Blogger Anda;
• Klik tombol Rancangan dan pilih Edit HTML;
• Beri Centang Expend Widget;
• Cari kode ]]></b:skin>
• Jika ketemu copy paste kode berikut diatas

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

• Terus scroll kebawah dan cari kode

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

• Lalu letakkan kode berikut sesudah kode diatas

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

• Simpan Template

selamat mencoba dan semoga brhasil serta bermanfaat bagi anda semua.

Source : Kang Fathur