Selasa, 03 April 2012

Cara Membuat Breadcrumb Menu Pada Blog


Membuat menu navigasi berurutan di atas artikel posting atau istilahnya disebut breadcrumb,merupakan cara efektif untuk memberikan kemudahan pengunjung dalam melihat kategori posting suatu blog.Disamping itu dari segi seo(search engine optimization),Google sudah support/mendukung breadcrumb ini.
Untuk melihat hasil dari sebuah blog yang sudah membuat breadcrumb/menu navigasi diatas posting bisa lihat gambar.



Cara Membuat Menu Breadcrumbs sebagai berikut :
  • Login ke blogger
  • Pilih Rancangan
  • Pilih Edit HTML
  • Conteng expand widget templates
  • Cari kode ]]></b:skin> gunakan Ctrl + F untuk memudahkan pencarian
  • Copy paste kode berikut di atas kode ]]></b:skin>.
#breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:10px;
line-height: 1.4em;
border-bottom:3px double #333;
}
  • Setelah itu cari kode
<div class='post hentry uncustomized-post-template'>      atau       <div class='post hentry'>
  • Letakkan  kode dibawah ini tepat dibawah kode di atas
<b:if cond='data:blog.pageType == &quot;item&quot; '>
<div id='breadcrumbs'>
Browse: <a expr:href='data:blog.homepageUrl'>Home</a> &gt; <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;'> &gt; </b:if>
</b:loop>
</b:if> &gt; <a expr:href='data:post.link'><data:post.title/></a>
</div>
</b:if>
  • Simpan Template dan selesai
Powered by Blogger