SELAMAT DATANG & SELAMAT MENIKMATI BLOG INI

Rabu, 29 Agustus 2012

Cara Membuat Menu Navigasi/Breadcrumb di Blog


Berikut ini saya men-share-kan Cara membuat menu navigasi atau yang biasa disebut - Breadcrumb navigation menu adalah menu yang dapat membantu para pengunjung blog agar mereka tau sedang mengunjungi kategori atau label apa. Postingan ini sangat banyak ditemui bila kita search di mensin pencari seperti Google. Dan berdasarkan pengalaman pribadi saya, banyak sekali kode atau scrift yang harus dibuat di menu edit HTML.  Namun saya mencoba untuk membagikannya kepada sobat yang ringkas saja. Untuk keunggulan atau kekurangannya, berpulang ke sobat semua.

Salain itu dari pengalaman melakukan blogwalking Breadcrumb atau menu navigasi juga dapat mengoptimalkan seo on page. Karna tidak semua template menyediakan Breadcrumb, maka dari itu kita harus membuatnya sendiri.


Untuk sobat yang ingin memasang Breadcrumb di blognya bisa mengikuti Cara Membuat Menu Navigasi/breadcrumb  di Blog berikut ini:
1. Login ke blog sobat.
2. Klik Template
3. Klik Edit HTML dan centang Expand Widget Templates 
4. Cari code ]]></b:skin> kalau mau lebih cepat gunakan Ctrl+f atau F3
5. Copy code di bawah ini lalu letakan tepat di atas code ]]></b:skin>

.breadcrumbs{
padding-left:10px;font-size:95%;
line-height:1.4em;
border-bottom:4px double #cadaef;
}
6. Cari code <b:includable id='post' var='post'> setelah ketemu silahkan sobat copy paste code di bawah ini dan letakan dibawah code <b:includable id='post' var='post'>

<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>
Anda disini &#187; <a expr:href='data:blog.homepageUrl'>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 != &quot;true&quot;'> , </b:if>
</b:loop>
</b:if> &#187; <data:post.title/>
</div>
</b:if>
</b:if>

Note :
untuk tulisan warna biru “Anda disini &#187” bisa diganti dengan “judul Blog Sobat” dan tulisan warna merah “Home”  bisa diganti dengan laman atau beranda di blog sobat.
7. Klik Pratinjau. Ini untuk memastikan scrift yang dibuat adalah benar.
8. Save Template sobat

selanjutnya silahkan lihat di atas postingan sobat,
jika berhasil menu navigasi akan terlihat di atas postingan sobat.
nah kira-kita begitulah Cara Membuat Menu Navigasi/breadcrumb di Blog.
semoga berhasil ya.

Sumber : http://andax89.blogspot.com/2012/07/cara-membuat-breadcrumb-di-blog.html

Tidak ada komentar:

Posting Komentar

Silahkan berkomentar menggunakan hati nurani dan tidak mengandung SARA, SEX dan POLITIK"