Cara Membuat Breadcrumb Navigation di Blog

Flamboyan68 - Fungsi atau manfaat dari Breadcrumb Navigation ini besar sekali,  dengan terpasangnya template ini akan sangat membantu dan memudahkan pengunjung blog kita untuk mengetahui posisi postingan artikel kita berada. Posisi Breadcrumb Navigation  ini letaknya tepat diatas postingan kita, lihat urut-urutannya  Home >> Nama Label >> Judul Postingan. Tidak ada salahnya apabila blog anda di pasang template Breadrumb Navigation, dan anda tidak akan rugi bila memasangnya malah akan mendatangkan manfaat besar terhadap blog anda dengan banjirnya pengunjung blog.

Apabila dikemudian hari anda ingin pasang, ikuti saja cara dan langkah di bawah ini:
Note: sebaiknya back-up dulu template anda di  unduh template lengkap untuk menghindari kegagalan / kesalahan dalam pemasangan kode - dan anda tinggal meng_unggah kembali template backup tadi

• Login / Masuk ke Blogger anda.
• Masuk ke menu Template.
• Pilih dan klik edit HTML.
• Carilah kode   ]]></b:skin>  untuk mempermudah pencarian gunakan Ctrl F
• Setelah ketemu kode tadi,  copy_kan kode CSS di bawah ini dan paste_kan tepat di atas kode ]]></b:skin>

  

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

• Selanjutnya cari kode  <b:includable id='main' var='top'> apabila sudah ketemu dengan kode itu. Ganti kode tersebut dengan kode di bawah ini 

<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs'><span>
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
</span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- breadcrumb for the post page -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'>
<span typeof='v:Breadcrumb'><a expr:href='data:blog.homepageUrl' property='v:title' rel='v:url'>Home</a></span>
<b:loop values='data:post.labels' var='label'>
&#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:loop>
&#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'>
<span>
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
</span> &#187; <span>Unlabelled</span> &#187;
 <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Home</a>
</span> &#187; <span>Archives for <data:blog.pageName/>
</span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<span><a expr:href='data:blog.homepageUrl'>Home</a>
</span> &#187; <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a>
</span> &#187; <span>Posts filed under <data:blog.pageName/>
</span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>

• Kemudian Save / Simpan Template.

Untuk melihat hasil dari pemasangan kode tadi silahkan anda tunggu antara 1 - 2 hari,  yang pasti breadcrumb anda akan tampil di hasil pencarian Google. So..anda bisa bersabar sedikit. Blog punya saya membutuhkan waktu sekitar 1 hari untuk melihat tampilan breadcrumb.
Demikianlah postingan saya kali ini, semoga bermanfaat dan sampai jumpa...  

Sumber: http://seotoni.blogspot.com/2013/01/cara-membuat-breadcrumbs-di-blogspot-seo.html