Cara Membuat Navigasi Breadcrumb

Beberapa hari lalu penasaran ngelihat salah satu bagian dari sebuah blog dimana pada bagian atas judul artikelnya terdapat urutan judul artikel, istilahnya seh kayak riwayat kita membuka artikel tersebut atau sumber/letak tulisan tersebut pada blog yang kita baca. Nah, ternyata itu namanya navigasi breadcrumb. Saya dapat panduan ini Blog Sobat Hizrian. Adapun fungsi dari navigasi breadcrumb yaitu untuk memudahkan pengunjung untuk kembali ke halaman sebelumnya.

Contoh navigasi breadcrumb

Berikut langkah membuatnya: 

1. Masuk dasbor
2. Pilih rancangan
3. Edit html
4. Centang Expand Template Widget
5. Kemudian cari kode ]]></b:skin>
6. Letakkan kode dibawah ini diatas kode ]]></b:skin>

.breadcrumbs{
padding-left:10px;font-size:95%;
line-height:1.4em;
border-bottom:4px double #cadaef;
}

• Kemudian cari kode <b:includable id='post' var='post'>
• Setelah ketemu, silahkan paste kode berikut tepat dibawah kode <b:includable id='post' var='post'>

1. <b:if cond='data:blog.homepageUrl == data:blog.url'>
   <b:else/>
   <b:if cond='data:blog.pageType == &quot;item&quot;'>
   <div class='breadcrumbs'>
   
   
   <b:if cond='data:blog.homepageUrl == data:blog.url'>
   <b:else/>
   <b:if cond='data:blog.pageType == &quot;item&quot;'>
   <div class='breadcrumbs'>
   Anda disini &#187; <a expr:href='data:blog.homepageUrl'>Home</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>