Memasang Breadcrumbs Pada Template Blogspot

Sekedar ikut-ikutan menerapkan tips-tips dari para blogger sebelumnya, salah satunya adalah memasang fitur breadcrumbs pada template blogspot.  Sobat bisa mengamati blog-blog tetangga dimana di atas judul postingan biasanya terdapat link dengan teks yang berukuran agak kecil. Link tersebut dapat berfungsi sebagai navigasi yang mana sebagai penanda bahwa kita sedang berada pada postingan di dalam kategori tertentu.

Susunan breadcrumbs biasanya seperti ini:
Home > Nama Label > Judul Posting

Kata master SEO, breadcrumbs sangat membantu meningkatkan kualitas SEO sebuah blog di mata search engine.  Karena banyak yang mempercayai dan membenarkan pernyataan tersebut, maka tidak ada salahnya kita mengikuti jejak para pendahulu, siapa tahu bisa mengangkat blog kita agar lebih SEO.

Untuk memasang Breadcrumbs, pertama-tama kita harus login dulu, lalu masuk ke edit html template. Setelah itu :
1. Letakkan kode di bawah tepat di atas kode ]]></b:skin>

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

2. Kemudian cari lagi kode seperti di bawah ini:

<b:includable id='main' var='top'>

3. Setelah ketemu lalu Anda ganti kode di atas tadi dengan kode yang ada 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'/>

4. Apabila semua sudah dilakukan selanjutnya klik Simpan Perubahan. Dan jika tahap yang Anda lakukan sudah sesuai dengan apa yang saya jelaskan diatas, maka Breadcrumb seharusnya sudah terlihat seperti contoh pada gambar dibawah ini.

Memiliki blog yang keren dengan berbagai pernak-pernik tentu menjadi salah satu kebanggan tersendiri, dan kini blog anda boleh bisa disejajarkan dengan blog-blog lain setelah dipasang breadcrumbs.