cara membuat breadcrumb di blog

Lumayan cukup lama juga saya tidak mengupdate dan membuat artikel baru di blog ini,oleh karena itu pada malam ini,saya akan membuat tutorial cara membuat breadcrumb di blog.Breadcrumb ini,konon katanya bisa menjadikan blog kita SEO friendly dan disukai oleh google,maka dari itu tidak ada salahnya anda memasang breadcrumb ini.Selain itu,dengan adanya breadcrumb maka akan memudahkan pengunjung blog untuk mengetahui letak dimana artikel anda tersimpan alias navigasinya menjadi lebih mudah.Bila anda belum tahu seperti apa itu breadcrumb,silahkan lihat gambar dibawah ini.

Lihat yang dilingkari garis warna merah,itu adalah breadcrumb.Jika anda ingin memasang atau membuat breadcrumb di blog,silahkan baca artikel ini sampai selesai :).

Pertama-tama,masuk ke menu Rancangan - Edit HTML - Expand template widget.Lalu cari kode di bawah ini melalui F3 atau Ctrl+F

<b:if cond='data:post.title'>

Dan bila sudah ditemukan,simpan kode ini dibawah kode yang diatas tadi.

<b:if cond='data:blog.pageType == "item"'>
<div class='breadcrumb'>
<a expr:href='data:blog.homepageUrl' rel='tag'>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 != "true"'>,</b:if>
</b:loop>
&gt;
</b:if>
<data:post.title/>
</div>
</b:if>

Sehingga menjadi seperti ini:

<b:if cond='data:post.title'>

<b:if cond='data:blog.pageType == "item"'>
<div class='breadcrumb'>
<a expr:href='data:blog.homepageUrl' rel='tag'>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 != "true"'>,</b:if>
</b:loop>

&gt;

</b:if>
<data:post.title/>
</div>
</b:if>

Setelah langkah tadi selesai,cari kode ]]></b:skin> dan simpan kode ini di atas kode tersebut.

.breadcrumb {
padding:4px 4px 4px 0px;
margin: 0px 0px 10px 0px;
font-size:96%;
line-height: 1.2em;
border-bottom:2px double #003000;
}

Hasilnya seperti ini :

.breadcrumb {
padding:4px 4px 4px 0px;
margin: 0px 0px 10px 0px;
font-size:96%;
line-height: 1.2em;
border-bottom:2px double #003000;
}
]]></b:skin>

Selanjutnya,simpan template dan lihat apakah sekarang blog anda sudah ada breadcumbnya atau belum.Silahkan baca juga artikel tips blogger dan SEO lainnya dibawah.Semoga bermanfaat dan jangan lupa berkomentar ya kalau tips nya sukses.Selamat mempraktekan cara membuat breadcrumb di blog.

Artikel Terkait: