Cara membuat breadcrumbs navigasi

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. untuk breadcrumbs wordpress self hosting baca artikelnya : membuat breadcrumbs wordpress.

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; <data:post.title/>
   </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’>

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>

Bagaimana? Mudah bukan dalam membuat breadcrumbs.
Jika ada yang kurang paham atau kurang mengerti bisa bertanya pada kotak komentar di bawah,secepatnya penulis akan menjawab.

**~SELAMAT MENCOBA~**

kata kunci postingan, cara membuat breadcrumbs,membuat breadcrumbs,kegunaan breadcrumbs,kode untuk membuat breadcrumbs, manfaat breadcrumbs, cara menerapkan breadcrumbs.