CARA MEMBUAT BREADCUMBS PADA BLOG

Sebelum saya menjelaskan CARA MEMBUAT BREADCUMBS PADA BLOG ada baiknya saya menjelaskan apa yang dimaksud dengan breadcumbs. Ini sedikit penjelasan mengenai breadcumbs dan apa fungsinya bagi sebuah blog.

Breadcumbs adalah suatu bentuk navigasi SEO sebaris yang biasa nya berada dibawah atau tepat diatas judul artikel pada setiap blog,breadcumbs biasanya muncul dalam bentuk horizontal dan mereka menyediakan link kembali ke halaman sebelumnya dan hingga ke halaman Home/Beranda. Jadi intinya seperti ini, Mesin pencari atau biasa disebut dengan Search engine selalu membaca label atau tags pada setiap postingan blog,karena saat ini google sudah tidak lagi menggunakan Meta Tag Keyword lagi untuk mengindeks suatu blog,maka yang jadi perhitungan google saat ini adalah Meta Description dan Label. Maka dari itu semakin relevan suatu label dengan isi artikel maka akan semakin besar kesempatan untuk tampil di halaman depan Google.

Sebagai gambaran saya memberikan sedikit contoh bentuk Breadcumbs yang saya miliki pada blog saya.

Nah.. sudah jelaskan seperti apa breadcumbs itu, selanjutnya mari kita terapkan pada blog yang teman-teman miliki.

1. Pertama,login dulu ke Blogger > pilih Template > dan klik Edit HTML

2. Pada Form edit HTML cari kode dibawah ini atau ketik ctrl+f dan ketik kode tersebut sebagai pencarian cepat.

]]></b:skin>

3. Setelah ketemu, letakkan kode ini tepat diatas kode yang teman-teman cari tadi.

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

4. Lalu, cari kode

<b:includable id='main' var='top'>

5. Setelah ketemu,hapus kode tersebut dan ganti dengan kode yang ada di bawah 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'> <b:if cond='data:label.isLast == "true"'> » <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span> </b:if> </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'/>

Simpan Template dan lihat blog teman-teman maka navigasi Breadcumbs telah muncul pada blog yang teman-teman miliki. Demikian sedikit petunjuk CARA MEMBUAT BREADCUMBS PADA BLOG dari saya, jika ada kekurangan silahkan beri komentar pada form di bawah, dan jika teman-teman merasa blog ini bermanfaat silahkan klik tombol share,dan berikan kepada teman-teman yang lainnya. Terima kasih.