Sunday, March 18, 2012

Cara Memasang Breadcrumb di Blogspot dengan Mudah

          hai para Blogger,Kembali lagi bersama saya (Ciye elah -.-). Dan kali ini saya akan Posting tentang Cara Memasang Beadcrumb di Blogspot, Apakah Breadcrumb itu?
Menurut Jacob Nielsen, ditinjau dari sisi usability breadcrumb 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.

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

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

SEO : Pengertian dan Fungsi Breadcrumb
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 breadcrumb dengan kombinasi horizontal dan vertikal juga masih ada.

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


Sudahtaukan bagaimana pentingnya Breadcrumb di Blog anda?
Pengen 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 please 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>
.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;
}
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='breadcrumbs'><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.)Breadcrumb ini akan terlihat sepertigambar di bawah ini






3.)dan Breadcrumb 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 search engine.
Terima kasih telah membaca ,jangan lupa baca artikel terkaitnya juga :D
Previous Post
Next Post

4 comments:

  1. Terima kasih sobat. sukses di pasang di blog saya

    ReplyDelete
  2. @hadhara rizka: oke gan sama", Semoga Blognya tambah keren, :D

    ReplyDelete
  3. Terimakasih untuk tutorial cara memasang breadcrumnya, dengan cara ini semoga cepat terindex google. Terimakasih ya...

    ReplyDelete

Admin Blog jarang memantau Blog di karenakan tugas di sekolah,Mohon maaf jika komentar belum di balas hingga saat ini Jadi mohon maaf atas ketidak nyamanan ini.
Silahkan komentar di bawah ini , Bila ada Komplain dan lain lain.
Dilarang berkomentar berbau SPAM, SARA, PORN, JUNK.

Gunakan Fasilitas Reply untuk menjawab pertanyaan

Spam adalah : dimana Seorang Blogger memasukan Link yg aktif di Kotak komentar
Komentar Tidak Selalu Langsung Saya Balas, Karena Saya Sibuk Dengan Sekolah. Terimakasih Atas Pengertiannya

Apabila Ada Kata-Kata Atau Tulisan Yang Salah Serta Komentar Yang Tidak Dibalas, Saya Mohon Maaf
Terima kasih sebelumnya [Boma-internet]

Sangajiboma. Powered by Blogger.
eXTReMe Tracker