Cara Membuat / Memasang Navigasi Breadcrumb di Blog

Cara Membuat / Memasang Navigasi Breadcrumb di Blog - Pada awal saya ngeblog, saya sempat membaca sebuah artikel yang dalam satu kutipan bilang begini " Navigasi breadcrumb adalah bagian dari blog yang keberadaannya dapat menunjang blogmu di mata search engine" membaca kata tersebut maka langsunglah saya membuat navigasi breadcrumb. eh pas mau buat ternyata nggak semuda yang di bayangkan, ternyata eror sob!!.
Sudah banyak macam breadcrumb navigasi yang saya pasang di blog saya tapi tak ada satupun yang bisa.. eror semua, terutama jika menerapkan 2 atau lebih kategori dalam 1 artikel. Dari situlah saya tahu, ternyata permasalahnnya adalah perbedaan kode di setiap template. Template yang ku pakai adalah template minima.
Navigasi breadcrumb sendiri adalah sebuah navigasi atau penunjuk halaman yang umumnya berfungsi untuk membantu memberikan informasi kepada  si pembaca tentang di artikel mana dan di menu apa si pembaca berada. bagi sobat yang tertarik untuk memasang navigasi breadcrumb di blog sobat, silahkan ikuti tutorial nya di jamin tidak eror dan so pasti SEO friendly...




Berikut Cara Membuat Navigasi Breacrumb di Blog.

1. Log in ke akun blog sobat.
2. Klik Rancangan---> Edit HTML --> Klik Download template lengkap
4. Letakkan kode berikut di atas kode ]]></b:skin>. ( gunakan Ctrl + F untuk memudahkan pencarian)
.breadcrumbs{
padding:5px 5px 5px 0;
margin:0;
font-size: 90%;
line-height:1.4em;
border-bottom:1px solid black;
}

5. Kemudian sobat cari kode seperti ini :

<b:includable id='post' var='post'>

6. Pastekan kode berikut tepat di bawahnya.
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>
You are Here &gt; <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;'> , </b:if>
</b:loop>
</b:if> &gt; <data:post.title/>
</div>
</b:if>
</b:if>

7. Yang terakhir sobat tinggal simpan template dan lihat hasilnya.

Semoga cara / trik di atas bisa membantu sobat blogger...
Previous
Next Post »

28 comments

Write comments
sejuta trik
AUTHOR
03:18:00 delete

jiah, minima mah mudah mas bro kodenya, ane sempat posting di blog saya, ada 2 trik di sana. emang banyak data post henry di blog kita. mungkin keliru tempatnya aj. yang lebih parah saya menemukan, breadrumb itu adalah nama makanan. wakakaka.. nice info gan

Reply
avatar
Tian
AUTHOR
15:28:00 delete

@sejuta trik m- hahaha!!! makasih mas sudah berkunjung..

balik lagi ya!!!

Reply
avatar
17:15:00 delete

makasih ya gan tutorialnya :)

Reply
avatar
Cozy
AUTHOR
17:54:00 delete

Keren infonya gan...ijin praktek plus copas gan...

Reply
avatar
20:10:00 delete

keren gan blognya,,,banyak tutorial yang bermanfaat...
sipp dech,,ditunggu selanjutnya

Reply
avatar
20:12:00 delete

keren gan blognya,,,banyak tutorial yang bermanfaat...
sipp dech,,ditunggu selanjutnya

Reply
avatar
02:41:00 delete

tutorial yang ajib untuk di praktekin d blog

Reply
avatar
18:58:00 delete

saya nyari gk ketemu'', ada saran gk?

Reply
avatar
08:53:00 delete

Makasih infonya bro, gak terpikir sebelumnya kalau navigasi seperti ini ternyata fungsinya lebih dari aksesories aja, ternyata amat bermanfaat buat optimasi seo juga

Reply
avatar
Anonymous
AUTHOR
02:08:00 delete

koq gk da klik download template lengakp??
trus gmna ni??

Reply
avatar
01:05:00 delete

Nice POst ...Bisa Juga....Gud Blog Mas....

http://igdblogger.blogspot.com/2012/08/sepeda-motor-bebek-injeksi-kencang-dan.html

blogwalking ya...

Reply
avatar
01:05:00 delete

Nice POst ...Bisa Juga....Gud Blog Mas....

http://igdblogger.blogspot.com/2012/08/sepeda-motor-bebek-injeksi-kencang-dan.html

blogwalking ya...

Reply
avatar
Unknown
AUTHOR
11:04:00 delete

Terima kasih kawan atas pencerahannya. Kasusnya sama soalnya. Ane pakek template minima. :D

Reply
avatar
04:34:00 delete

nah ini yg aku mau ada pemisahan artikel.

Reply
avatar
07:16:00 delete

wew gan...
keren gan, mirip seperti directory diforum2 :D

Blogspot Tutorial

Reply
avatar
topSpot
AUTHOR
05:55:00 delete

Ajib bener navigasi nya bro! Thanks for share ya :D

Reply
avatar
Unknown
AUTHOR
20:23:00 delete

Muantafffffff buener....
langsung praktek..

http://infounixs.blogspot.com

Reply
avatar
09:18:00 delete

thanks sob, breadcumbnya berhasil ane pasang di blog.. :D

Reply
avatar
om
AUTHOR
04:19:00 delete

koq saya gak brhasil ya gan? padahal benar caranya, mohon penjelasannya lagi gan, heeee

www.omsambudy.blogspot.com

Reply
avatar
00:02:00 delete

Mntap gan....ijin sedot!!!!!hahhaa

Reply
avatar
Alfiyah
AUTHOR
22:38:00 delete

makasih mastah..saya nyari2 baru ketemu ulasan ini...mantaff mastah...

Reply
avatar
Motorservo
AUTHOR
21:04:00 delete

Artikelnya bagus gan, terimakasih sudah berbagi..

Reply
avatar
20:40:00 delete

makasih Mas sudah mau berbagi,saya sudah coba di tkp,hasilnya kok gak langsung ya Mas.

Reply
avatar
Unknown
AUTHOR
20:55:00 delete

Saya sudah pakai breadcumb! Thanks tutorialnya :)

Reply
avatar
02:26:00 delete

Saya juga sudah ikuti tutorial Agan,dan hasilnya bisa dilihat di Blog saya yang sangat sederhana ini.
sejahtera slalu Gan.

Reply
avatar
22:54:00 delete

izin copas Mas,
mantaaap,

Reply
avatar
E-BASINDO
AUTHOR
03:21:00 delete

WAH, thanks sob infonya, aku udah terapkan di blog-ku. kunjungan balik ke blog-ku ya.. :D

Reply
avatar
Alan
AUTHOR
01:25:00 delete

Apa benar dengan memasang breadcrumbs bisa SEO friendly? Makasih sebelumnya gan

Reply
avatar