Cara Membuat Breadcrumbs SEO di Blog

Navigation Breadcrumbs

Wah... ini tutoral lama ya sob yang saya share, karena ini permintaan teman saya, semua artikel tutorial di blog Kang Fandi ini sebenernya teman-teman saya yang request, kalau sobat ingin request juga bisa tinggal kirim email di trickafandi@gmail.com , padahal tutorial kayak gini di blog laen juga ada, tapi entah kenapa katanya temen saya kalau di blog Kang Fandi kelihatan lebih nyaman.. heheh... becanda sob...

Berikut cara pemasangan breadcrumbs di blog :

1). Pergi ke blogger Dasbhboard > Template > Edit HTML.
2). Cari kode seperti ini ]]></b:skin>.
3). Dan copy kode di bawah ini, kemudian paste 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;}

4). Setelah itu cari lagi kode seperti ini <b:includable id='main' var='top'> dan ganti/replace 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'/>

5). Kemudian save....

Note: Sebelum memberi breadcrumbs periksa dulu template sobat apakah sudah terpasang breadcrumb atau belum, jika sudah terpasang nanti dalam pemasangan ini akan terajadi error atau bisa di hapus salah satu kode breadcrumbs yang ingin di pasang di blog.

Untuk melihat breadcrumb sudah terpasang atau belum, sobat bisa memasukkan salah satu link di blog sobat ke sini http://www.google.com/webmasters/tools/richsnippets , breadcrumbs yang sudah terpasang nanti akan terlihat seperti gambar di bawah ini.

Breadcrumbs di Pencarian Google

Breadcrumbs di Postingan Blog

Terimakasih... Semoga artikel dari Kang Fandi kali ini bermanfaat bagi Sahabat blogger....

Terima kasih telah membaca artikel Cara Membuat Breadcrumbs SEO di Blog . Jika Anda ingin copy-paste / menyalin sebagian ataupun keseluruhan dari artikel ini, harap anda mencantumkan link berikut Cara Membuat Breadcrumbs SEO di Blog sebagai sumbernya atau anda bisa copy permalink dibawah ini.
<a href="https://kang-fandi.blogspot.com/2014/02/cara-membuat-breadcrumbs-seo-di-blog.html">Cara Membuat Breadcrumbs SEO di Blog</a>

Bagikan Artikel Ini : Facebook Google+ Twitter