Cara Membuat breadcrumbs

Bagaimana cara membuat breadcrumb/breadcrumbs? Apa kegunaan breadcrumb/breadcrumbs? Seperti apa breadcrumbs itu?

Breadcrumbs ialah sebuah navigasi blog/website yang di gunakan untuk mempermudah pengunjung dalam mencari artikel lain dalam satu blog/website.

Breadcrumbs juga bisa menjadikan blog/website SEO Friendly

,di karenakan index search engine mudah dalam meng-crawl-ling isi dari blog/website tersebut.

Contoh dari breadcrumbs bisa di lihat pada top page blog ini yang bertulis browse. Lalu bagaimana cara membuat breadcrumbs? Seperti apa kode breadcrumbs? Lets do it.

Cara membuat breadcrumbs

Hal pertama yang harus dilakukan ialah

1. login-->tata letak-->edit HTML.
   
2. download full template, untuk berjaga-jaga jika terjadi kesalahan.
   
3. beri tanda centang pada kotak kecil disamping tulisan
   '' Expand Template Widget''
   
   
4. cari kode ]]></b:skin>
   
5. copy kode dibawah ini, diatas kode ]]></b:skin>
   
   

   .breadcrumbs {
   padding: 5px 5px 5px 0px;
   margin: 0px 0px 15px 0px;
   font-size: 95%;
   line-height: 1.4em;
   border-bottom: 3px double #e6e4e3;
   }

   
   
6. cari kode berikut <div class='post hentry uncustomized-post-template'>
   
7. paste kan script di bawah ini persis di bawah kode <div class='post hentry uncustomized-post-template'>
   
   <b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='breadcrumbs'>browse &#187; <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> <b:loop values='data:posts' var='post'> <b:if cond='data:post.labels'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast == &quot;true&quot;'>&#187; <a expr:href='data:label.url' rel='tag'><data:label.name/></a> </b:if>&#187;<span><data:post.title/></span> </b:loop> </b:if> </b:loop> </div></b:if> <b:else/> <b:if cond='data:blog.pageType == &quot;archive&quot;'> <div class='breadcrumbs'>browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; Archives for <data:blog.pageName/> </div></b:if> <b:else/> <b:if cond='data:navMessage'> <div class='breadcrumbs'><data:navMessage/> </div></b:if> </b:if>

Jika Kode diatas gagal gunakan script berikut ini dan tempatkan di dibawah kode <b:includable id='post' var='post'>


<em>Browse: <a expr:href='data:blog.homepageUrl'>Home</a> <b:if cond='data:blog.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> / <a expr:href='data:post.link'> <data:post.title/></a></em>

Bagaimana? Mudah bukan dalam