Cara Membuat Navigasi Breadcrumb di Blog - Blogger Tutorial Web : Tips dan Trik Cara Membuat Blog dan Website Lebih Seo
Terkini Populer Kategori
News
Loading...

21 February 2013

Cara Membuat Navigasi Breadcrumb di Blog

Cara Membuat Navigasi Breadcrumb di Blog
Anonymous
21 February 2013
Cara Membuat Navigasi Breadcrumb di Blog  - Cara memasang / memberi navigasi breadcrumb di blog atau cara membuat menu navigasi breadcrumb di blog atau cara membuat menu berjajar di atas posting di blog - Apa itu navigasi breadcumb? Navigasi breadcrumb adalah suatu bentuk navigasi konten blog kita sedemikian rupa sehingga bisa membantu pengunjung lebih mudah untuk menjelajah konten blog. Lalu bagaimana cara membuat navigasi breadcrumb itu? Gampang! Berikut ini saya akan menulas bagaimana cara membuat navigasi breadcrumb.

1. Login ke Blog sobat >> Klik Template >> Edit HTML >> Lanjutkan (jangan lupa centang Expand Template Widget).
2. Lalu cari kode <b:if cond='data:post.title'> (bisa menggunakan CTRL+F atau F3). Jika ada dua kodenya pilih yang pertama. 
3. Kemudian copy kode dibawah letakkan dibawah <b:if cond='data:post.title'> tadi.
<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>
4. Lalu cari kode berikut  ]]></b:skin>
5. Letakkan kode berikut di atas kode nomor 4
.breadcrumb { padding:5px 5px 5px 0px; margin: 0px 0px 10px 0px; font-size:90%; line-height: 1.2em; border-bottom:3px double #e6e4e3; }
7. Simpan Template dan lihat hasilnya.

Happy Blogging..!

Share with your friends

Add your opinion
Disqus comments

Ads Auto