Tutorial Memasang Breadcrumb Navigasi pada Blogger / Blogspot - Nanang Blog

Salam blogger, Tutorial Memasang Breadcrumb Navigasi pada Blogger / Blogspot – Breadcrumb adalah sebuah navigasi halaman yang berfungsi untuk memudahkan user untuk menavigasi halaman blog atau website. Dengan memasang Breadcrumb, blog kita menjadi lebih SEO Friendly. Pembaca menjadi lebih mudah dalam menelusuri halaman blog kita.

Adapun langkah – langkah yang harus dilakukan dalam memasang Breadcrumb navigasi pada Blogger adalah sebagai berikut :

1. Terlebih dulu Anda harus login ke dashboard blogger Anda
2. Login sukses, pilihlah Rancangan | Edit HTML
3. Sebelum melakukan langkah pengeditan template, centang Expand Widget Template
4. Carilah kode dibawah ini menggunakan bantuan CTRL + F

]]></b:skin>

5. Setelah ketemu letakkan kode css berikut tepat diatasnya kode ]]></b:skin> :

.breadcrumb {
padding:5px 5px 5px 0px;
margin: 0px 0px 10px 0px;
font-size:90%;
line-height: 1.2em;
border-bottom:3px double #e6e4e3;
}

6. Carilah kode dibawah ini menggunakan bantuan CTRL + F

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

7. Setelah ketemu letakkan kode berikut tepat dibawah kode <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> &#187;
<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>
&#187;
</b:if>
<data:post.title/>
</div>
</b:if>

8. Simpan dan lihat hasilnya. Bagaimana Sukses. . .

Demikikian Tutorial Memasang Breadcrumb Navigasi pada Blogger / Blogspot dari saya. Anda bisa mengkreasi sendiri letak dari breadcrumb pada template weblog Anda. Jangan lupa tinggalkan komentar dan jempol Anda.

Happy Blogging, Happy Design