Cara Membuat Breadcrumb Navigasi Di Blogger (Seri 2)

Pada artikel Sebelumnya kita sudah bahas Cara Membuat Breadcrumb Navigasi di Blooger (Seri 1), nah sekarang kita akan mencoba cara lain untuk membuat breadcrumb navigasi di blogger, yaitu dengan menggunakan script dari hoctro. Jadi apabila rekan-rekan ingin membuat breadcrumb navigasi tetapi tidak bisa menggunakan cara sebelumnya di seri 1, mungkin bisa mencoba cara berikut ini.
Baik sekarang kita langsung saja, cara membuatnya sebagai berikut :

- Log in ke Blogger dengan ID kita;
- Klik Tata Letak / Layout;
- Klik Tab Edit HTML;
- Klik Download Template Lengkap, dan silahkan kembali ke template semula;
- Tandai kotak Expand Template Widget;
- Cari kode di bawah ini di template kita (untuk memudahkan pencarian tekan Ctrl + F);
<b:includable id='main' var='top'>

- Jika sudah ketemu, sekarang letakkan breadcrumb script berikut, tepat di atasnya :

<b:includable id='breadcrumbs' var='post'>
<!-- Breadcrumbs hack. By Hoctro 9/11/2006 http://hoctro.blogspot.com -->
<b:if cond='data:blog.pageType == "item"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:post.labels'>

Browse:
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> &gt;
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'>
<a expr:href='data:label.url' rel='tag'> <data:label.name/></a>
</b:if>
</b:loop>
<b:if cond='data:post.title'>
&gt; <b><data:post.title/></b>
</b:if>

</b:if>
</span>
</p>
</b:if>
<!-- End of Breadcrums Hack -->
</b:includable>

- Cari kode berikut di template kita :
<b:if cond='data:post.dateHeader'>

- Jika sudah ketemu, letakkan kode di bawah ini, tepat di atasnya :
<b:include data='post' name='breadcrumbs'/>

- Cari kode ]]></b:skin> di template kita, jika sudah ketemu letakkan barisan kode css breadcrumb di bawah ini, tepat di atasnya :

.breadcrumbs {
border-bottom:1px dotted #000;
margin:2em 0 0.5em;
padding:0 0 0.5em;
}

- Klik tombol Simpan Templates;
- Selesai.

Selamat mencoba semoga bermanfaat.

Artikel Terkait :