Friday, May 27, 2016

Cara Memasang Brdcrumb di Blogspot dengan Mudah


hai para Blogger,Kembali lagi bersama saya (Ciye elah -.-). Dan kali ini saya akan Posting tentang Cara Memasang Bdcrumb di Blogspot, Apakah Brdcrumb itu?
Menurut Jacob Nielsen, ditinjau dari sisi usability brdcrumb mempunyai beberapa fungsi, yaitu:

• Menunjukkan lokasi atau path dari halaman web yang sekarang sedang dikunjungi, relatif terhadap struktur halaman di atasnya.
• Menyediakan fitur one-click access ke level halaman web di atasnya sekaligus menghindari user tersesat karena terlalu dalam menjelajahi website.

Brdcrumb ini sangat bermanfaat bagi pengunjung tatkala struktur website yang kita bangun memiliki hirarki atau tingkatan.
Macam-macam model yang biasanya dipakai dalam membuat brdcrumb adalah seperti berikut.

1. Horizontal
Model ini yang sudah biasa dipakai para blogger, karena cenderung hemat tempat dan strukturnya lebih mudah dipahami.


2. Vertikal
Model yang ini agak memerlukan space yang lebih banyak tetapi tetap banyak yang menggunakannya.


3. Kombinasi horizontal dan vertikal
Walaupun tidak banyak, memasang brdcrumb dengan kombinasi horizontal dan vertikal juga masih ada.

Terus apakah situs yang menunya tidak banyak perlu menggunakan brdcrumb?
Seperti yang telah ditulis di atas, brdcrumb sangat bermanfaat apabila web/blog yang kita buat mempunyai menu dengan beberapa tingkatan/hirarki. Namun bila web/blog kita hanya sedikit menunya kayaknya brdcrumb kurang begitu bermanfaat.
Jadi perlu atau tidaknya memasang brdcrumb, ya harus disesuaikan dengan kondisi web/blog sobat.


Sudahtaukan bagaimana pentingnya Brdcrumb di Blog anda?
Pen tau cara memasangnya langsung Ikut langkah di bawah ini...!
1. Login ke blogger degan ID anda.
2. Klik Tata Letak / layout
3. Kemudian klik tab Edit HTML
4. Click Download Full Template and plse back up your template first. Untuk menghindari bila sewaktu-waktu ada kesalahan.
5. Beri tanda centang pada kotak kecil di samping tulisan Expand Template Widget.

6. Cari kode ]]></b:skin>
7. Copy lalu paste kode di bawah ini persis di atas kode ]]></b:skin>.brdcrumbs {
padding:5px 5px 5px 0;
margin:0;font-size:95%;
line-height:1.4em;
border-bottom:4px double #e2e7b4;
}
.brdcrumbs a {
text-decoration:none;
color: #000000;
}8. Silahkan cari kode berikut pada template anda :
<div class='post hentry'>

9. Copy lalu 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 == &quot;item&quot;'> <div class='brdcrumbs'><a expr:href='data:blog.homepageUrl'>Ganti Dengan Kata Kunci Utama Blog</a> &#187; <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;'> , </b:if> </b:loop> </b:if> &#187; <data:post.title/> </div> </b:if> </b:if> ►Simpan/save dan silahkan lihat hasilnya
*Note : 1.)Kata Berwarna merah ganti dengan yg lain Sebagai Contoh saya gunakan
Boma-internet
2.)Brdcrumb ini akan terlihat sepertigambar di bawah ini






3.)dan Brdcrumb ini tidak akan muncul di Home Blog anda dan akan muncul saat anda membaca penuh artikel anda :D


Style template seperti ini akan menambah seo friendly sebuah template dan semoga akan semakin meningkatkan serp anda dalam srch engine.
Terima kasih telah membaca ,jangan lupa baca artikel terkaitnya juga :D

No comments:

Post a Comment