Cara Pasang Navigasi Breadcrumb di Blogger

Cara Pasang Navigasi Breadcrumb di Blogger: Menurut para master, Navigasi Breadcrumb selain bisa berfungsi sebagai salah satu faktor yang bisa membantu blog agar lebih SEO friendly, Breadcrumbs juga bisa memudahkan pengunjung dalam menavigasi tiap halaman blog dan tentunya hal ini juga akan menguntungkan bagi anda dalam tujuan untuk meningkatkan page views visitors di blog kesayangan.

Oh ya khusus bagi yang belum tahu apa itu Breadcrumb dan bagaimana bentuknya, supaya lebih jelas anda bisa melihat contohnya pada gambar dibawah.

Gambar Breadcrumb yang terpasang diblog kusnadikomputer ini

Ok sudah mengerti bukan? jadi untuk mempersingkat waktu sekarang silahkan saja simak bagaimana cara memasang navigasi breadcrumb di blogger atau blogspot anda.

1.Login di account blogger.com lalu tuju halaman Rancangan > Edit HTML



2.Centang kotak kecil pada bagian Expand Template Widget



3.Letakkan kode CSS berikut tepat di atas kode ]]></b:skin>

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

4.Setelah itu cari kode <b:if cond='data:post.title'> atau jika tidak menemukan coba cari kode <b:if cond=&quot;data:post.title&quot;> lalu letakkan kode berikut tepat diatasnya

<b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='breadcrumbs'><a expr:href='data:blog.homepageUrl'>Home</a> &#8250; <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;'> &#8250; </b:if> </b:loop> </b:if> &#8250; <data:post.title/> </div> </b:if> </b:if>

5.Save/Simpan hasil editan template anda.

Tambahan, agar Breadcrumb bisa menjadi lebih SEO Friendly bagi Search Engine seperti Google, Bing, maupun Yahoo. Silahkan baca artikel sebelumnya di SEO: Memaksimalkan Penggunaan Breadcrumb Di Blog.