Cara Membuat Navigasi Breadcrumb di Blog

Cara Membuat Navigasi Breadcrumb di Blog  - cara membuat menu navigasi breadcrumb di blog atau Cara memberi/ memasang navigasi breadcrumb di blog atau cara membuat menu berjajar di atas posting di blog.
Setelah kemarin saya jelaskan tentang cara  SEO yaitu Cara Merubah Tag Heading Blogspot Menjadi SEO dan Cara Memasang Meta Tag Keyword dan Deskripsi di Blog  kali ini saya masih menjelaskan tentang Cara Membuat Navigasi Breadcrumb di Blog

Sebelum saya jelaskan lebih lanjut Cara Membuat Navigasi Breadcrumb di Blog alangkah baiknya mengetahui apa yang di maksud dengan navigasi breadcumb? Navigasi breadcrumb merupakan suatu bentuk navigasi konten untuk blog kita yang dapat membantu pengunjung agar lebih mudah untuk menjelajah isi atau konten blog. Oke saya rasa sudah mengerti kan apa navigasi breadcumb itu, sekarang langsung saja berikut ini adalah cara membuat navigasi breadcrumb:

1. Pertama anda harus Login/ masuk ke Blog anda --> Klik Template --> Edit HTML --> Lanjutkan (jangan lupa centang Expand Template Widget).
2. Kemudian setelah itu anda cari kode <b:if cond='data:post.title'> (untuk mempermudah pencarian dapat menekan tombol CTRL dan F atau menekan tombol F3 pada keybord). Jika terdapat dua kode anda pilih yang pertama. 
3. Setelah ketemu kode <b:if cond='data:post.title'> anda copy kode dibawah ini dan paste/letakkan tepat dibawah <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>
4. Kemudian anda cari kode ]]></b:skin>
5. Setelah ketemu kode ]]></b:skin> , anda letakkan kode di bawah ini di atas 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;

}
7. Langkah yang terakhir anda Simpan Template dan lihat hasilnya.

Demikian sedikit Cara Membuat Navigasi Breadcrumb di Blog yang saya ketahui, semoga dapat bermanfaat buat anda. Terimakasih anda telah berkunjug di blog Temukan Cara ini.


Komentar