Cara membuat menu Breadcrumb di blog

 

Menu Breadcrumb adalah menu navigasi yang berurutan yang terletak di atas artikel, berfungsi untuk memudahkan pengunjung dalam menjelajahi blog kita atau dengan kata lain memberi petunjuk kepada pengunjung kalua meraka berada di halaman yang mana dengan label apa, selain itu menu Breadcrumb juga salah satu tehnik optimasi SEO yang sudah diterapkan oleh master-master blog. Berikut cara membuat menu Breadcrumb

*Login ke Blogger.com
*Pilih Rancangan >>Edit Html>>Jangan Lupa Centang "Expand Widget Template" Agar bisa mengedit template secara keseluruhan.
*Backup template anda untuk berjaga-jaga bila terjadi kesalahan.
*Lalu cari kode berikut ; <b:includable id='main' var='top'>

 (untuk memudahkan pencarian tekan F3 atau CTRL+F)

*jika sudah ketemu letakkan kode berikut tepat diatas kode tadi :

<b:includable id='breadcrumbs' var='post'>

  <b:if cond='data:blog.pageType == "item"'>
      <p class='breadcrumbs'>
      <span class='post-labels'>
        <b:if cond='data:post.labels'>

          Browse:
          <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>  &gt;
          <b:loop values='data:post.labels' var='label'>
            <b:if cond='data:label.isLast == "true"'>
              <a expr:href='data:label.url' rel='tag'> <data:label.name/></a>
            </b:if>
          </b:loop>
          <b:if cond='data:post.title'>
&gt;  <b><data:post.title/></b>
          </b:if>

        </b:if>
      </span>
      </p>
  </b:if>
</b:includable>

*Kemudian cari  kode <b:if cond='data:post.dateHeader'>

Dan letakkan kode berikut diatasnya :

<b:include data='post' name='breadcrumbs'/>

* Terakhir letakkan kode CCS dibawah ini tepat diatas kode ]]></b:skin>

.breadcrumbs {
border-bottom:1px dotted #000;
margin:2em 0 0.5em;
padding:0 0 0.5em;
}

*Simpan template.dan lihat Hasilnya…

Demikian yang saya tahu tentang Cara membuat menu Breadcrumb di blog

Jika ada dari sobat-sobat yang pengen menambahkan silahkan menyampaikannya di kolom komentar.trims…..