Breadcrumb secara harfiah dapat diartikan sebagai remahan roti, tapi dalam dunia blogging sendiri,
breadcrumb memiliki peran yang lumayan penting untuk membuat blog kita menjadi lebih SEO Friendly.
Definisi Breadcrumb dalam dunia blog adalah sebuah bantuan navigasi yang digunakan dalam user interface sehingga memudahkan user dalam menavigasi halaman blog/ web.
Bukan hanya mempermudah navigasi dan berperan dalam
SEO On Page karena disukai oleh robot Google,
breadcrumb juga memperindah tampilan URL kita di SERP. Berikut adalah contoh blog/ website yang sudah memakai navigasi breadcrumb :
Bagaimana cara membuat/ memasang breadcrumb di blogspot? Nah, simak bersama yuk bareng Tutorial Blog Pemula :
1. Login ke akun blogger Anda, pilih Rancangan =-=> Edit HTML, centang Expand Template Widget.
2. Untuk menghindari error yang tidak diinginkan, sebaiknya Download Full Template ( melakukan back up template ) terlebih dahulu.
3. Cari kode ]]></b:skin>, kemudian paste kode dibawah ini 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 #e2e7b4;
}
.breadcrumbs a {
text-decoration:none;
color: #000000;
}
4. Cari kode <div class='post hentry'>, kemudian paste kode di bawah ini persis di bawah kode <div class='post hentry'> :
<b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == "item"'> <div class='breadcrumbs'><a expr:href='data:blog.homepageUrl'>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> </b:if>
5. Save dan Selesai!
Silakan perhatikan perubahan navigasi pada blog Anda.
Selamat Mencoba!