31 Maret 2012

Cara Memasang Breadcrumb

Mungkin sudah banya yang memberikan trik dan tips dari Para Master tentang Cara Memasang Breadcrumb, tapi tak ada salahnya jika saya kembali share tentang Cara Memasang Breadcrumb ini, menindak lanjuti postingan sebelumnya tentang Cara Menghilangkan Error dan Warning Rich Snipperts, yang mana Menu Breadcrumb Navigasi selain Menghilangkan Error dan Warning pada Rich Snippets ini juga berfungsi untuk memudahkan pengunjung mengetahui dimana tempat link yang aktif atau sedang dikunjungi,,,


Gambar 999 Blog


Untuk Cara Memasang Breadcrumb seperti gambar diatas berikut langkah-langkahnya :

  • Masuk ke dashboard  pilih Rancangan Template EDIT HTML
  • Seperti biasa jangan lupa download atau back up template anda
  • centang Expand Template Widget
  • Agar lebih mudah gunakan Ctrl+F untuk melakukan pencariaan kode-kode nya
  • Cari kode   ]]></b:skin> 
  • Tempatkan kode berikut diatasnya
 .breadcrumbs {padding: 5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:95%; line-height:1.4em; border-bottom:3px double #e6e4e3;}
  • Kemudian cari kode <b:include data='top' name='status-message'/>
  • Jika ada 2 kode yang sama seperti diatas, tempatkan kode berikut dibawah keduanya
<b:include data='posts' name='breadcrumb'/>
  • Langkah berikutnya, cari kode  <b:includable id='main' var='top'>
  • Letakkan kode berikut di atas kode  <b:includable id='main' var='top'>
<b:includable id='breadcrumb' var='posts'><b:if cond='data:blog.homepageUrl == data:blog.url'><!-- No breadcrumb on home page --><b:else/><b:if cond='data:blog.pageType == "item"'><!-- breadcrumb for the post page --><p class='breadcrumbs'>
<span class='post-labels'>
<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 == "true"'> »
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
</b:loop>
<b:else/>
»Unlabelled
</b:if>
» <span><data:post.title/></span>
</b:loop>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb for the label archive page and search pages.. -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:blog.pageName == ""'>
<a expr:href='data:blog.homepageUrl'>Home</a> » All posts
<b:else/>
<a expr:href='data:blog.homepageUrl'>Home</a> » Posts filed under <data:blog.pageName/>
</b:if>
</span>
</p>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
  • Simpan / Save Template anda

Selamat Mencoba



3 komentar:

  1. mantap gan, info yang berguna
    salam kenal

    BalasHapus
  2. Terimakasih untuk tutorial cara memasang breadcrumnya, dengan cara ini semoga cepat terindex google. Terimakasih ya...

    BalasHapus

Popular Posts

Copyright@2015 999 Blog || Designed ByBlogger Templates-Blogger