Buat Breadcrum Dengan Banyak Label - Tentunya sobat semua sudah sangat paham tentang arti breadcrumb dan kegunaannya bagi blog kita, saya tidak akan membahas itu hanya saja saya akan bahas tentang Breadcrumb versi terbaru. Kita ketahui bersama breadcrumb lama tidak bisa mengadopsi banyak label dan hanya satu label saja, itu jelas akan membatasi kita untuk membuat banyak kategori atau label, karena jika kita pasang banyak kategori breadcrumb biasanya error. Nah ini ada versi terbaru untuk buat breadcrumb dengan banyak label, dan antar label dipisahkan dengan tanda koma, sehingga dengan breadcrumb banyak label, kita bisa mengimprovisasi blog kita dengan banyak kategori sehingga blog kita bisa SEO friendly, dan diharapkan bisa menaikkan SERP kita dan traffic bisa meningkat sehingga bisa lebih cepat terindeks di mesin pencari. Nah tanpa harus berpanjang lebar marilah kita langsung ke TKP :
1. Seperti biasanya login dulu blog sobat di Blogger, lalu pilih "Rancangan",
terus
klik Tab "Edit HTML" , Centang Kotak Expand Template Widget.
2. Cari kode berikut mirip seperti <div class='post hentry'> (atau ketikkan hentry pada kotak search, tekan ctrl + F untuk
membuka kotak search)
3. Copy kode berikut, dan paste tepat di bawah kode <div class='post hentry'>
3. Copy kode berikut, dan paste tepat di bawah kode <div class='post hentry'>
<b:if cond='data:blog.pageType ==
"item"'>
<div class='breadcrumbs'>
<span class='Apple-style-span' style='font-family: Verdana, sans-serif;'>Your Are Here</span><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9P1bT0A4NmdjLHtylMyozS8LfEKVi_AxPtBPhr4uTD_TpqXbmStktlK4RZdYt_Et2ooLuHUm7LjgpmRH1SCsZZA4df4cQhSctSvFjgLUmNHGbVri1K_TLUvHbF6HANDDqvt4RGKTV5vg/s1600/kangsalman+crumb.gif'/> <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
»
<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>
»
</b:if>
<data:post.title/>
</div>
</b:if>
<b:if cond='data:blog.pageType == "archive"'>
<div class='breadcrumbs'>
<span class='Apple-style-span' style='font-family: Verdana, sans-serif;'>Browse</span><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9P1bT0A4NmdjLHtylMyozS8LfEKVi_AxPtBPhr4uTD_TpqXbmStktlK4RZdYt_Et2ooLuHUm7LjgpmRH1SCsZZA4df4cQhSctSvFjgLUmNHGbVri1K_TLUvHbF6HANDDqvt4RGKTV5vg/s1600/kangsalman+crumb.gif'/> <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
» Archives for <data:blog.pageName/>
</div>
</b:if>
<div class='breadcrumbs'>
<span class='Apple-style-span' style='font-family: Verdana, sans-serif;'>Your Are Here</span><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9P1bT0A4NmdjLHtylMyozS8LfEKVi_AxPtBPhr4uTD_TpqXbmStktlK4RZdYt_Et2ooLuHUm7LjgpmRH1SCsZZA4df4cQhSctSvFjgLUmNHGbVri1K_TLUvHbF6HANDDqvt4RGKTV5vg/s1600/kangsalman+crumb.gif'/> <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
»
<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>
»
</b:if>
<data:post.title/>
</div>
</b:if>
<b:if cond='data:blog.pageType == "archive"'>
<div class='breadcrumbs'>
<span class='Apple-style-span' style='font-family: Verdana, sans-serif;'>Browse</span><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9P1bT0A4NmdjLHtylMyozS8LfEKVi_AxPtBPhr4uTD_TpqXbmStktlK4RZdYt_Et2ooLuHUm7LjgpmRH1SCsZZA4df4cQhSctSvFjgLUmNHGbVri1K_TLUvHbF6HANDDqvt4RGKTV5vg/s1600/kangsalman+crumb.gif'/> <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
» Archives for <data:blog.pageName/>
</div>
</b:if>
Jika sudah selesai, simpan template dan lihatlah hasilnya... dan jika sobat ingin menggunakan kotak (border) dalam breadcrumb, tambahkan kode berikut ini tepat di atas ]]></b:skin> :
.breadcrumbs {
padding:8px 0px 10px 5px;
margin: 0px 0px 5px 0px;
font-size:88%;
border:1px double
#e6e4e3;
}
padding:8px 0px 10px 5px;
margin: 0px 0px 5px 0px;
font-size:88%;
border:1px double
#e6e4e3;
}
Setelah itu simpan template, dan cek sekali lagi hasilnya....wow...amazing man...hehehe.
Demikian artikel tentang " Buat Breadcrumb Dengan Banyak Label," semoga bermanfaat, dan jika ada kritik atau saran yang bersifat membangun monggo dikomentari..terima kasih.
Dipersembahkan Oleh : cillasmartcorp ~ Blog Khusus Kontes SEO dan Blogger
Sobat sedang membaca artikel tentang BUAT BREADCRUMB DENGAN BANYAK LABEL dan sobat bisa menemukan artikel BUAT BREADCRUMB DENGAN BANYAK LABEL ini dengan url https://kseoblog.blogspot.com/2012/05/buat-breadcrumb-dengan-banyak-label.html, Sobat boleh menyebar luaskannya atau mengcopy paste-nya jika artikel BUAT BREADCRUMB DENGAN BANYAK LABEL ini sangat bermanfaat bagi sobat semua, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya :
SEO
- PING BLOG INDEKS LEBIH CEPAT
- NAIKKAN PAGERANK BLOG DENGAN SUBMIT RSS FEED
- BACKLINK OTOMATIS
- BACKLINK UNLIMITED SISTEM JARINGAN
- BACKLINK GRATIS BLOG DOFOLLOW
- PAGERANK GOOGLE
- KONTES SEO
- CARA MEMBUAT TEMPLATE BLOG LEBIH VALID XHTML
- RAMUAN SEO UNTUK BLOG BARU MASUK TOP TEN
- INDEX BLOG BARU SUPER CEPAT
- SEO YANG SERING DILUPAKAN
- EDIT BLOGSPOT JADI SEO FRIENDLY
- AWAS ADA SEO
- SEO
{ 3 komentar... Views All / Send Comment! }
makasih infonya ,akansaya coba semoga berhasil
salam sukses om
makasih sekali info nya om, memang saya lagi membuat blog nih..mudah2an sangat membantu saya..
tks y om
Salam kenal, Sobat blogging...kunjungan Pertamax
Di blog sobat yang keren ini. izin simak yah sob..?
Menarik artikelnya. izin di terapin di blog saya thx Kawan
Kaluu ada waktu singgah juga di blog saya
Di Karrysta - http://karristaent.blogspot.com/
Maaf nyimpen link terima kasih
Salam sukses Sobat......
Posting Komentar
Komentar sobat semua adalah bagian dari jiwa blog ini, jadi kemukakan pendapat sobat tentang blog atau artikel disini dengan bahasa yang santun dan penuh tanggung jawab, insyalloh sobat akan mendapat banyak manfaat minimal pahala .. hehehe..