gadis gadis nakal: Cara Membuat Link Navigasi Breadcrumb di Blogger/Blogspot

Cara Membuat Link Navigasi Breadcrumb di Blogger/Blogspot. Blogging di awal ngeblog memang nggak ada habisnya. Apalagi buat seorang newbie yang lagi belajar sepertiku. Dari pertama membuat tanggal postingan, membuat tabel untuk postingan blogger sampai dengan membuat link di bagian footer blogger. Sekarang aku juga bingung lagi ketika membuat alamat link navigasi breadcrumb.

Cara ini sudah saya test dan berhasil. Memang bukan yang pertama, karena semuanya juga nggak ada yang pertama kali kayaknya. Tapi tentu hal ini sudah selamanya buat para blogger untuk mengedit situs mereka. Selain untuk mudah dibaca oleh mesin cari Google. Ternyata dengan tambahan seperti membuat navigasi breadcrumb juga dapat memudahkan pengunjung dalam mengetahui kategori dari artikel yang sedang mereka baca.

baik basa basinya cukup. Berikut ini adalah cara membuat link navigasi breadcrumb untuk blogger/blogspot:

Login ke dasbor blogger
Pilih Design
Lalu pilih Edit HTML
Dan jangan lupa Expand Widget Templates. Sebelum melakukan pengeditan disarankan untuk membackup seluruh templatenya terlebih dahulu agar jika terjadi error masih ada cadangan templatenya.

Copy CSS dibawah ini DI ATAS/SEBELUM kode ]]></b:skin>

#breadcrumbs {padding:5px 5px 5px 0px;margin: 0px 0px 15px 0px;font-size:10px;line-height: 1.4em;border-bottom:1px dotted #CCCCCC;}

Kalau sudah di taruh kode CSS di atas. Silahkan cari kode <b:if cond='data:post.title'> ini di source kodenya dengan menekan CTR:+F (Firefox/Google Chrome). Setelah ketemu silahkan Paste kode di bawah ini tepat DI ATASNYA. Terkadang ada 2 kode. Namun dari yang aku coba sendiri di kode pertamalah pemasangan navigasi breadcrumb ini berjalan.

<b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == "item"'> <div class='breadcrumbs'> Browse > <a expr:href='data:blog.homepageUrl'>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> </b:if>

Kalau sudah silahkan di SAVE dan lihat hasilnya. Semoga berhasil yach. Semoga bermanfaat. Cara Membuat Link Navigasi Breadcrumb di Blogger/Blogspot

Lihat tips dan trik lainnya di blog heboh berikut ini:
Source: http://germo-ndeso.blogspot.com/2011/12/cara-membuat-navigasi-breadcrumb.html#ixzz1mwB9Z7of