Apa itu Breadcumbs (Navigasi Atas) Pada Blogger
Apa itu Breadcumbs ?
Breadcrumbs adalah salah satu aksesoris blogger yang juga diperlukan untuk mengoptimasi sebuah halaman posting, biasanya muncul secara horizontal di bagian atas pada halaman posting artikel blog anda atau Lebih tepatnya ada di bawah bar judul atau header posting. Adapun Breadcrumbs Blogger ini menyediakan link penghubung kembali ke halaman sebelumnya setiap user menavigasi antar link untuk menuju ke halaman yang aktif atau halaman induk dari halaman yang aktif. Sehingga link navigasi ini akan memberikan jejak bagi pengguna untuk mengikuti kembali ke titik awal atau entri sebelumnya. Sebuah tanda yang lebih besar dari (>) sering berfungsi sebagai pemisah hirarki, meskipun dapat menggunakan simbol lainnya (seperti »atau>), serta beragam grafik.
Contoh Screnshoot Link Navigasi Breadcumbs |
Home » kategori » katehori2 » artikelblog
Beranda > Blog > Cara Membuat > Tutorial cara Breadcumbs Blogger
Tutorial lengkap Cara Membuat Navigasi Breadcumbs untuk Blogger
Setelah kita mengetahui jelas tentang navigasi breadcumbs, Langsung saja kita pelajari cara membuatnya / memasang si breadcums pada blog kita.
2. Setelah masuk, ke menu Template » Edit HTML » Lanjutkan
3. Selanjutnya jangan lupa untuk men-Centangkan Expand Template Widget
4. Langkah berikut adalah mencari Cari kode ]]></b:skin> dan simpan kode dibawah ini tepat diata diatas ]]></b:skin> tersebut:
.breadcrumbs{padding:0px 5px 5px 0;margin-bottom:20px;margin-top:0px;font-size:11px;color:#5B5B5B;border-bottom:1px dotted #bbb;}5. Langkah berikut adalah mencari kode source <b:includable id='main' var='top'>, hapus dan langsung ganti dengan kode dibawah ini:
<b:includable id='breadcrumb' var='posts'><b:if cond='data:blog.homepageUrl != data:blog.url'> <b:if cond='data:blog.pageType == "static_page"'> <div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span><data:blog.pageName/></span></div> <b:else/> <b:if cond='data:blog.pageType == "item"'> <!-- 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'> » <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span> </b:loop> » <span><data:post.title/></span> </div> <b:else/> <div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div> </b:if> </b:loop> <b:else/> <b:if cond='data:blog.pageType == "archive"'> <!-- breadcrumb for the label archive page and search pages.. --> <div class='breadcrumbs'> <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Archives for <data:blog.pageName/></span> </div> <b:else/> <b:if cond='data:blog.pageType == "index"'> <div class='breadcrumbs'> <b:if cond='data:blog.pageName == ""'> <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>All posts</span> <b:else/> <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <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'/>6. Dan Langkah terakhir adalah Simpan Template, coba lihat apakah breadcums sudah terpasang dengan benar di blog? jika breadcumb atau navigasi belum tampil maka coba dipelajari lagi cara yang benar diatas.
Adapun Fungsi dari breadcrumb pada blog itu sendiri adalah untuk membantu pengunjung blog untuk mengetahui sedang dihalaman mana pengunjung tersebut sekarang berada dibagian web kita.
Dengan Navigasi breadcrumb, maka urusan url navigasi blog bisa lebih mudah ditemukan. Selain itu, breadcrumb ini dipercaya juga sangat baik untuk Blog agar lebih seo friendly, karena navigasi ini memperkaya kata kunci dalam postingan artikel. Demikianlah pengenalan sedrhana dan singkat tentang cara membuat navigasi breadcumbs khususnya blog berplatform blogspot, Jika ada yang mau menambahkan dengan senang hati ditunggu dikotak komentar. Salam blogger indonesia!