Advertisement
Semua blogger, pasti menginginkan blognya menjadi nomor satu di mata search engine. Baik itu Google, Bing, ataupun search engine yang lainnya. Berbagai cara pun dilakukan untuk bisa memancing perhatian mesin pencari agar selalu memprioritaskan blog kita di urutan yang pertama. Mulai dari merubah tampilan blog agar lebih menarik dan simple. Sampai dengan mengutak-atik template blog agar menjadi lebih SEO friendly.
Jika berbicara tentang search engine, pasti tidak jauh dari yang namanya SEO. Karena dengan menerapkan SEO (Search Engine Optimization) pada blog kita, maka kita akan bisa mengoptimalkan blog kita di mata search engine tersebut.
Nah, sobat Penghuni 60, salah satu cara yang bisa membantu meningkatkan nilai SEO blog kita di mata search engine, adalah dengan cara memasang Breadcrumbs pada blog kita.
Apa itu Breadcrumbs?
Breadcrumbs adalah menu navigasi yang akan muncul di atas sebuah postingan atau artikel manakala kita sedang membuka artikel tersebut. Menu navigasi itu bisa membantu para pembaca artikel kita untuk mengetahui diposisi mana artikel yang sedang mereka baca itu berada dalam arsip blog kita. Contohnya, bisa sobat lihat diblogku ini. Sebuah tampilan menu navigasi bisa sobat temukan terletak persis di atas postingan ini. Atau sobat bisa lihat contoh bentuknya seperti ini:
Lalu, bagaimanakah cara membuat Breadcrumbs?
Untuk bisa memasang Breadcrumbs ini, maka sobat diwajibkan sudah memasang label atau kategori di blog sobat. Karena menu yang akan ditampilkan sebagai breadcrumbs itu berdasarkan sorting pada label. Nah, jika sobat sudah mempunyai label, maka ikutilah langkah-langkah cara membuatnya di bawah ini.
Langkah-langkah Cara Memasang Breadcrumbs di Blog:
- Silahkan sobat login terlebih dahulu ke akun blogger sobat
- Setelah itu pilih menu Template – Edit HTML
- Cari kode berikut ini: ]]></b:skin>
- Jika sudah ketemu, taruh kode di bawah ini tepat di atasnya:
.breadcrumbs{border-bottom:1px solid #ccc; border-top:1px solid #ccc; padding:0.5em 0 0.5em; font-size:11px;}
kode #ccc adalah kode warna garis atas dan bawah menu, untuk pilihan warna garis, bisa disesuaikan dengan selera kalian masing-masing.
- Jika sudah, sekarang cari lagi kode berikut ini: <b:includable id='main' var='top'>
- Ganti kode di atas dengan kode di bawah ini:
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == "static_page"'>
<div class='breadcrumbs'><span><a title='Home' expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<!-- breadcrumb for the post page -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'>
<span typeof='v:Breadcrumb'><a title='Home' expr:href='data:blog.homepageUrl' property='v:title' rel='v:url'>Home</a></span>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'>
» <span typeof='v:Breadcrumb'><a expr:title='data:label.name' expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:if>
</b:loop>
» <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a title='Home' expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a title='Home' expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == ""'>
<span><a title='Home' expr:href='data:blog.homepageUrl'>Home</a></span> » <span>All posts</span>
<b:else/>
<span><a title='Home' expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>
- Jangan lupa “Simpan template”
- Selesai
Untuk mencobanya, silahkan sobat buka salah satu postingan sobat. Jika di atas postingan sobat sudah muncul sebuah navigasi menu yang bisa mengarahkan kita ke homepage, dan label postingan, berarti breadcrumbs sudah sukses terpasang. ^_^)b selamat ya...
Semoga dengan adanya navigasi breadcrumbs ini, blog kita akan menjadi lebih SEO friendly lagi. Amin.
Artikel Menarik Lainnya:
dengan memasang breadcrumbs ini blog kita jadi lebih seo friendly ya mas. nice tips
BalasHapustetapi untuk saat ini penggunaan template hasil download sudah terpasang breadcrumbs sob,, kalau masalah seo dan tidak mungkin sobat lebih paham..hehehe
BalasHapussave ya sob, buat dipasang nanti
BalasHapuspunyaku blom ada neh, makasih sob, tinggal pasang
BalasHapusuntungnya saya sudah memasangnya dan itu bawaan template gratisan hehee
BalasHapusblog saya sudah ada breadcrumbnya dari templatenya
BalasHapusuntung punyaku udah ada.. hehe tinggal optimasi postingan aja
BalasHapusoh yang itu tah baru tahu setelah baca comen aku. Template gratisan yang tak pasang juga sudah ada berarti.
BalasHapusOoh, itu yang namanya breadcrumbs.. Kayaknya blog ku belum gini deh :)
BalasHapusKeren artikelnya Mas bisa di ganti nih Breadcrumb
BalasHapusSaya dengan yang ini, di bungkus dulu yah Mas
Makasih sudah berbagi. salam hormat selalu
Alhamdulillah saya udah menerapkannya. Karena memang lebih profesional dengan cara ini.
BalasHapusEh mas ikutan survei blog saya ya?
Memang segala hal yang berkaitan dengan template seo friendly termasuk breadcrumb semacam ini penting untuk dijalani
BalasHapus@Elsawati Dewi: iya mbak, ini merupakan salah satu trik SEO yg aku dapatkan dari masternya
BalasHapus@Devy Indriyani: iya sih, ada yg sudah ada, ada jg yg tidak.. biasanya yg ada itu template hasil karya seorg blogger sendiri yg sudah mengerti SEO, sedangkan kalo yg belum ada, itu biasanya template yg tampilannya secara umumnya saja, alias belum ada fitur2 tambahannya.
@Beranda Kata: oke sob, silahkan disave ya..
@Wongcrewchild: oke sob, silahkan dipasang sob.. :)
@Intan Sudibjo: hehe, iya sob, ada yg sudah ada , ada jg yg belum..
@Valentino: bagus donk kalo gitu :)
@Bagus Prehan: siiiplah ^_^)b langsung aja sob di optimasi
@Mus Djono: kalo sudah ada ya jgn dipasang lagi sob.. :D
utk yg belum ada saja
@Etika Maria: nah loh, buruan dikasih sob.. :)
@Saud Karrysta: hehe, kalo sudah ada sih mendingan jangan sob, daripada nanti di utak atik mlh gak jadi...
@Ustadz Adam: syukurlah kalo sudah diterapkan. boleh nanti aku mampir ya... survei apaan sob?
@Ferry: iya sob, penting gak penting, selama gak bikin loading blog jd berat, mendingan dilakukan saja.. :D
wah, kebetulan sekali mas wawan, blogku blm punya yg kayak ginian, langsung ah diterapin, mksh ya mas
BalasHapusmantep bgt tipsnya sob, langsung praktek nih
BalasHapus@Fitriyana: oke Fit, silahkan dicoba ya..
BalasHapus@Michael: hehe, mksh sob, silahkan dipraktekan sob..
@Bay Detect: sori sob, gak boleh pasang link ya..
asiik, trik SEO lagi, cocok bgt nih buat blogku yg msh baru, thanks mas...
BalasHapusmas wawan ini emang masternya SEO
:)
Navigasi untuk 'memudahkan' pengunjung blog memang amatlah penting. Tips yang hendaknya dilakukan oleh para Blogger agar Blog SEO friendly. Beberapa waktu lalu saya juga telah memasang trik seperti ini. Terima kasih sharingnya. Salam cemerlang!
BalasHapusKomentar ini telah dihapus oleh administrator blog.
BalasHapusinfo yang berguna, ntar mau saya coba mas,thanks
BalasHapusKami dari tim redaksi
BalasHapusKawandNews menawarkan untuk anda bersedia sebagai penulis artikel di kawandnews.com
Berminat? silahkan masuk http://www.kawandnews.com/2013/01/lowongan-penulis-berita-dan-artikel.html
Komentar ini telah dihapus oleh administrator blog.
BalasHapus@Obat Tradisional: oke mbak silahkan diterapin aja
BalasHapus@Herdoni: sama sob, salam juga. ^_^
@Rozi: oke sob, silahkan
@Anggar: mkasih sob infonya, sudah aku kirim tuh surat lamarannya :)
Makasih mas tipsnya,
BalasHapuswah banyak juga ya mas kode nya hehehe :D
BalasHapusmau tak praktekkan tapi saya pakai wordpress mas, jadi nggak bisa deh hehehe :D
O.. itu yg namanya breadcrumb ya.. baru tahu nih istilahnya.. Thanks infonya
BalasHapusudah ada bawaan template
BalasHapusbm ya mas.....
@Nunu: sama2 mbak :D
BalasHapus@Info Saja: wah, asik donk, gak perlu susah utak atik kode lg sob
@Wahyu Eka Prasetiyarini: iya mbak Rin, kalo pake wordpress tuh bingung, aku aja sampe skrg blm bisa2 tuh utak atik kode di wordpress
@Nandar: oke sob.. :)
@Maya: enak donk May.. :)
sudah saya terapin mas di blog saya, mks ya
BalasHapuskebetulan sekali, di blogku blm ada nih
BalasHapusKomentar ini telah dihapus oleh administrator blog.
BalasHapusmksh tutornya
BalasHapusmksh kunjungannya
http://blog.seniorennet.be/Sluffertjes_creations/
BalasHapusGreetings with stormy weather from 't Sluffertje my friend
Pastinya berguna buat yg belum memasang menu navigasi ini ya mas..
BalasHapusnice info
BalasHapus@Superhero: sama2 sob, selamat ya sudah berhasil
BalasHapus@Sukma: sip, silahkan dicoba sob
@Obat sakit: sama2 sob
@Rudi: thanks my friend
@Purnomo: iya sob, soalnya dari templatenya ada jg yg sudah ada, gak perlu masang lg
@Cikgu Bada: terima ksh Cik
this very usefull for me.. thank U very much
BalasHapuswah, sepertinya di blogku blm ada sob, pengen aku coba nanti, save dulu ya
BalasHapuswahh surprise banget nih jadi guest this week nya penghuni 60, bisa bikin pengunjung blogku makin banyak, terima kasih banyak ya sob :)
BalasHapusMaaf klo lama gak ksni ,saya lagi sibuk didunia nyata ,,saya udah masang breadcrumbs sob ...malahan dari bawaan template itu sendiri...hehe
BalasHapus@Yippee Kay Yay: OK, Kay.. thank U for your attention :)
BalasHapus@Jejak Jelajah: siap sob, silahkan di save, lalu terapin ya, biar SEO friendly :)
@Rozi: hehe, sama2 mas Rozi, semoga bermanfaat.. :D minggu ini blog mas Rozi jd Guest Star di blogku
@Aully Bukan: waduh, sibuk niyeee... :D semoga makin sukses aja deh bisnis di dunia nyatanya.. emang beberapa template sudah ada bawaan dari sananya, tips ini khusus buat yg blm punya aja sob
blogku belum punya yg seperti itu sob, musti dipasang nih biar seo friendly
BalasHapusbagus bgt nih mas tipsnya, di blogku kayaknya belum ada deh.. ini apa bisa bikin seo blog jd bagus ya mas?
BalasHapustak coba deh
sip..sip nanti dicoba deh
BalasHapusmakasih tipsnya kang, jadi pengen nih memasang Breadcrumbs di blog... jdi memudahkan pengunjung mengetahui posisi postingan yg dibaca :)
BalasHapusKomentar ini telah dihapus oleh administrator blog.
BalasHapuswaduh dtg singgh
BalasHapusayo ayo siapa blognya yg belum dipasangi breadcrumbs? cepetan pasang.. tutorialnya sudah disediakan disini oleh mas Wawan
BalasHapusblog-nya mas jadi daftar bacaan saya lho...
BalasHapusutk artikel yang ini, saya ijin untuk bungkus mas..
jaya selalu blogger indonesia..
jadi kelihatan lebih rapi ya mas tampilan blog kita di search engine :)
BalasHapussudah ane coba mas :) makasih infonya mas,
BalasHapusmantap gan infonya :)
BalasHapuswah bisa dicoba nih! makasih infonya gan, salam kenal :)
BalasHapusmantap..
BalasHapusthanks gan infonya