Seperti janji zoel kemarin, hari ini zoel akan memberikan trik cara membuat navigasi breadcrumb di blogger, seperti yang sudah saya posting sebelumnya (baca : manfaat breadcrumb) bahwa baik sekali manfaat breadcrumb di mata google. Breadcrumb merupakan suatu petunjuk / jejak pengunjung sampai pada halaman artikel yang dia datangi.
Coba perhatikan tampilan breadcrumb seperti ini :
Browse » Home » tutorial blog » Domain .co.cc bisa diakses tanpa WWW
@ tutorial blog = ini merupakan nama label dari postingan tersebut
@ Domain .co.cc bisa diakses tanpa WWW = ini adalah judul postingan dimana pengunjung sedang berada.
Biasanya letak breadcrumb berada di atas judul postingan (bukan dihalaman utama).
Untuk yang belum pasang breadcrumb, langkah pembuatan breadcrumb :
1. login blogger
2. Design - edit HTML
3. centang kotak kecil (checkbox) bertuliskan expand widget template (tunggu beberapa detik)
4. Sekarang cari kode <div class='post hentry uncustomized-post-template'> (untuk memudahkan pencarian gunakan ctrl+f dan masukkan kode tersebut)
5. pastekan kode dibawah ini, tepat dibawahnya kode tadi :
Save template dan selamat sobat sudah punya tampilan breadcrumb.
Coba perhatikan tampilan breadcrumb seperti ini :
Browse » Home » tutorial blog » Domain .co.cc bisa diakses tanpa WWW
@ tutorial blog = ini merupakan nama label dari postingan tersebut
@ Domain .co.cc bisa diakses tanpa WWW = ini adalah judul postingan dimana pengunjung sedang berada.
Biasanya letak breadcrumb berada di atas judul postingan (bukan dihalaman utama).
Untuk yang belum pasang breadcrumb, langkah pembuatan breadcrumb :
1. login blogger
2. Design - edit HTML
3. centang kotak kecil (checkbox) bertuliskan expand widget template (tunggu beberapa detik)
4. Sekarang cari kode <div class='post hentry uncustomized-post-template'> (untuk memudahkan pencarian gunakan ctrl+f dan masukkan kode tersebut)
5. pastekan kode dibawah ini, tepat dibawahnya kode tadi :
<b:if cond='data:blog.pageType == "item"'>
<a href='http://namablog.blogspot.com/'>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/>
</b:if>
Save template dan selamat sobat sudah punya tampilan breadcrumb.
No comments:
Post a Comment