Berbagai pertanyaanya yang muncul saat kita mendengar istilah NAVIGASI BREADCUMB ini, "Apa sih maksudnya ?". Lalu akan muncul lagi pertanyaan, "Apa kegunaannya atau fungsinya ?". Ceritanya begini, navigasi breadcumb ini pada dasarnya adalah merupakan suatu bentuk program navigasi konten (isi) web/blog yang kita miliki, yang disusun sedemikian rupa sehingga dapat membantu pengunjung (blog kita tentunya) agar dapat menjelajahi seluruh isi konten blog yang kita miliki ini. Secara singkat navigasi breadcumb dapat diartikan sebagai program "kompas navigator blog" (istilah saya sendiri ini).Contoh hasil daripada navigasi-breadcumb ini adalah seperti gambar di bawah ini :
Nah, setelah melalui tahapan penjelasan, maka berikut ini adalah tahapan atau cara membuatnya :
Log-in ke blog anda, rancangan/disain, edit HTML (centang expand template widget), lalu carilah deskripsi seperti ini (untuk lebih cepat, gunakan tombol crtl-F) : <b:if cond='data:post.title'>
Jika terdapat dua kode, maka pilihlah kode yang pertama kali, selanjutnya letakkan script di bawah ini tepat di bawah kode tersebut di atas. Inilah scriptnya :
<b:if cond='data:blog.pageType == "item"'>
<div class='breadcrumb'>
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> »
<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 != "true"'>,</b:if>
</b:loop>
»
</b:if>
<data:post.title/>
</div>
</b:if>
<div class='breadcrumb'>
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> »
<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 != "true"'>,</b:if>
</b:loop>
»
</b:if>
<data:post.title/>
</div>
</b:if>
Langkah selanjutnya adalah (dengan metode yang sama) carilah kode berikut ini ]]></b:skin>
Selanjutnya copykan script di bawah ini tepat di atas kode tersebut, dan inilah scriptnya :
.breadcrumb {
padding:5px 5px 5px 0px;
margin: 0px 0px 10px 0px;
font-size:90%;
line-height: 1.2em;
border-bottom:3px double #e6e4e3;
}
padding:5px 5px 5px 0px;
margin: 0px 0px 10px 0px;
font-size:90%;
line-height: 1.2em;
border-bottom:3px double #e6e4e3;
}
Setelah itu simpanlah template anda, dan selesai sudah.
Untuk informasi lebih lanjut perihal Navigasi Breadcumb ini, dapat anda temukan DI SINI.
Sepertinya navigasi breadcumb ini tidak langsung terindex oleh Google, adakah cara mempercepatnya ?
BalasHapusSaya juga sudah pasang navigasi breadcrumb ini, dan sudah terindeks Google, salam
BalasHapusSaya sudah buat belum ya yang ini? Hmm cuman sering denger sampai lupa cek dan sudah belum dilakukan. ahaha, thanks infonya sob. Cek dulu ahh disearch engine
BalasHapusboleh tanya: apa anda juga pakai script yang ini masalahnya saat saya coba browsing" tentang breadcrumb, script yang disuruh memasangkan itu banyak, apa yang ini juga bisa mas.. thanks
BalasHapus@teknologikomputer9 : Untuk membuat Navigasi Breadcrumb yang dapat langsung terindeks oleh Google, silahkan anda menuju ke Peringatan: Dilarang Menampilkan Link Aktif Sama, itu blog aku juga .... happy blogging
BalasHapus