Jumat, 29 April 2011

Cara Membuat Menu Navigasi Breadcrumbs di Blogger

Menu navigasi breadcrumbs merupakan menu hirarki untuk mengelompokkan artikel dalam suatu kategori atau label yang sama. Untuk lebih jelasnya perhatikan tulisan kecil yang ada di atas judul posting ini atau lihat gambar di samping. Bila di template Anda belum terdapat menu navigasi breadcrums ini dan Anda ingin memasangnya, berikut ini langkah-langkahnya.


Masuk ke akun Blogger Anda.

Klik Rancangan > Edit HTML.

Back up template dulu dengan mengeklik Download Template Lengkap untuk mengantisipasi kalau nanti terjadi kesalahan.

Beri tanda centang pada Expand Template Widget.

Cari kode ]]></b:skin> (Gunakan Ctrl + F untuk memudahkan pencarian).

Copy kode di bawah ini dan paste di atas kode tersebut.

#breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:10px;
line-height: 1.4em;
border-bottom:3px double #333;
}

Selanjutnya cari kode <div class='post hentry'>

Kemudian copy kode berikut ini dan paste di bawah kode tersebut.

<b:if cond='data:blog.pageType == &quot;item&quot; '>
<div id='breadcrumbs'>
Browse: <a expr:href='data:blog.homepageUrl'>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 != &quot;true&quot;'> &gt; </b:if>
</b:loop>
</b:if> &gt; <a expr:href='data:post.link'><data:post.title/></a>
</div>
</b:if>

Klik tombol SIMPAN TEMPLATE.

Lihat artikel Anda untuk melihat hasilnya.

Tidak ada komentar:

Posting Komentar