Cara Mudah Memasang Breadcrumbs di Blogger

Pada kesempatan ini admin akan membagikan tutorial bagaimana cara memasang breadcrumbs yang terindex Google di blog. Jadi breadcrumbs yang akan kita pasang disini adalah breadcrumbs yang terindex mesin pencaharian alias bukan hanya tampil di template blog saja. Mungkinsaja ditemplate anda telah terpasang breadcrumbs tapi apakah breadcrums yang terpasang adalah breadcrumbs yang terindex?

Pada dasarnya, breadcrumbs adalah elemen web yang memiliki fungsi sebagai navigasi halaman dan bisa disebut sebagai navigasi sekunder dalam web. Sebab, breadcrumbs bisa menunjukkan urutan struktur halaman mana saja yang sudah dibuka oleh pengunjung website tersebut.

Biasanya, breadcrumbs pada website atau blog memang memiliki struktur yang lebih pendek. Beda halnya dengan breadcrumbs pada toko online atau website, seperti contoh berikut ini.

Breadcrumbs pada toko online biasanya memiliki struktur yang lebih panjang karena e-commerce memiliki lebih banyak kategori dan produk yang banyak macamnya. Alhasil, perlu diberikan navigasi yang berbeda setiap kategori produknya.

Adapun panjang pendeknya suatu breadcrumbs sangat tergantung dari struktur konten dalam web. Bila dianalogikan sebagai alamat, alamat rumah yang terletak di pinggir jalan tidak begitu panjang karena gampang ditemukan. Sementara, rumah yang terletak di daerah terpencil atau pelosok maupun yang padat penduduk perlu ditulis detailnya, bahkan kalau bisa patokan atau ciri-cirinya agar lebih mudah ditemukan. Sama halnya dengan breadcrumbs.

Walau terlihat sepele, breadcrumbs menjadi bagian yang penting pada website karena bisa berfungsi sebagai navigasi setelah menu utama. Pengunjung web pun akan dapat lebih mudah dalam menjelajahi web. Karena pengunjung tidak perlu mengulang navigasi dari awal untu menemukan artikel atau halaman serupa pada web.

Misalnya saja web yang memiliki struktur breadcrumbs Home > News > Tips Memasak > Cara Memasak Rendang, maka pengunjung yang ingin mencari kumpulan Tips Memasak lainnya tidak perlu kembali ke Home, cukup dengan mengklik breadcrumbs bagian Tips Memasak.

Cara Memasang Breadcrumb di Blogger

Tentu saja login ke akun Blogger kamu. Masuk ke edit template anda dan pilih edit HTML. Kemudian pada edit HTML Silahkan cari kode </b:skin>  dan letakan kode di bawah ini di atas kode </b:skin>

.breadcrumbs{padding:0 5px 5px 0;margin:0 0 5px;font-size:11px;border-bottom:1px dotted #ccc;font-weight:normal}

Sekarang silahkan Cari kode <b:includable id='main' var='top'> dan ganti dengan kode Berikut ini.

<b:includable id='breadcrumb' var='posts'><b:if cond='data:blog.homepageUrl != data:blog.url'><b:if cond='data:blog.pageType == &quot;static_page&quot;'><div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span><data:blog.pageName/></span></div><b:else/><b:if cond='data:blog.pageType == &quot;item&quot;'><!-- breadcrumb for the post page --><b:loop values='data:posts' var='post'><b:if cond='data:post.labels'><div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'><span typeof='v:Breadcrumb'><a expr:href='data:blog.homepageUrl' property='v:title' rel='v:url'>Home</a></span><b:loop values='data:post.labels' var='label'>&#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span></b:loop>&#187; <span><data:post.title/></span></div><b:else/><div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span>Unlabelled</span> &#187; <span><data:post.title/></span></div></b:if></b:loop><b:else/><b:if cond='data:blog.pageType == &quot;archive&quot;'><!-- breadcrumb for the label archive page and search pages.. --><div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Archives for <data:blog.pageName/></span></div><b:else/><b:if cond='data:blog.pageType == &quot;index&quot;'><div class='breadcrumbs'><b:if cond='data:blog.pageName == &quot;&quot;'><span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>All posts</span><b:else/><span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Posts filed under <data:blog.pageName/></span></b:if></div></b:if></b:if></b:if></b:if></b:if></b:includable><b:includable id='main' var='top'><b:include data='posts' name='breadcrumb'/>

Save template.

Kehadiran breadcrumbs dapat mengoptimalkan SEO web dan akhirnya akan berpengaruh ke ranking di search engines (mesin pencarian). Pasalnya, breadcrumbs menjadi elemen web yang disukai user dan juga bot dari search engine.

Melalui breadcrumbs, Google akan lebih mudah dalam memahami struktur data di website sehingga dapat menampilkan hasil pencarian yang relevan mengenai website tersebut. Alhasil, ketika konten dianggap relevan oleh user, maka posisinya di mesin pencarian akan semakin di atas.

Adanya breadcrumbs juga dapat mengurangi bounce rate atau persentase pengunjung website yang meninggalkan website tanpa mengklik apapun. Sebab, breadcrumbs mampu mengindeks halaman web hingga struktur navigasi terdalam. Pengunjung web pun bisa melewati navigasi yang rumit dari homepage dan bisa menemukan konten yang dicari dengan sekali klik.

Membuat breadcrumbs bisa meningkatkan traffik, tetapi banyak diantara mereka yang melakukan optimasi secara berlebihan yang belum tentu menciptakan hasil yang memang baik. Jadi biasakanlah untuk selalu membuat kategori pada setiap postingan, jika tidak maka pemasangan breadcrumb pada template blogspot akan sia-sia dan tidak bermaanfaat.