Pasang Breadcrumb Google di Blogger

Pasang Google Breadcrumb di Blogger. Memasang atau membuat google breadcrumb ini memang di butuhkan karena dengan memasang google breadcrumb, bisa membantu menutupi salah satu kekurangan blogger. Kekurangan tersebut yaitu alamat url posting yang terbatas. Makanya mulai sekarang ayo pasang google breadcrumb di blog anda :). Selain itu, dengan Google breadcrumb akan membuat blog kita di search engine google lebih terlihat rapi. Coba anda lihat contoh Google Breadcrumb di bawah ini.
Pasang Breadcrumb Google di Blogger

Cara Memasang Breadcrumb Google di Blogspot / Blogger

  • Langkah pertama untuk memasang Breadcrumb Google tentu saja anda harus login dulu ke blognya kwkwk.
  • Seperti biasa, ke halaman design > edit HTML > Expand Widget Templates (jangan lupa selalu backup template sebelum editing)
  • Cari kode <b:include data='top' name='status-message'/> , biasanya ada 2 kode tersebut. Kalau sudah di temukan, silahkan paste kode berikut ini tepat di atasnya (paste aja di atas 2 kode yang anda temukan biar ga bingung).
    <b:include data='posts' name='breadcrumb'/>
  • Sekarang cari kode <b:includable id='main' var='top'> dan kalau sudah ketemu, paste kode berikut tepat di atas kode <b:includable id='main' var='top'>
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- 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 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 == &quot;true&quot;'>
 &#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:if>
</b:loop>
 &#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span>Unlabelled</span> &#187; <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Posts filed under <data:blog.pageName/></span>
</b:if></div></b:if></b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
Simpan Template dan selesai, anda berhasil memasang breadcrumb google di blog anda.

Untuk mempercantik Breadcrumb google yang sudah anda pasang, sekarang tambahkan sedikit sentuhan Css berikut ini yang perlu anda tambahkan di atas kode ]]></b:skin>

.breadcrumbs{margin-left:10px;padding: 5px 0;border-bottom: 1px dotted; line-height:1.4em;}
Ok itu saja artikel kali ini dan mudah-mudahan bermanfaat buat para blogger. Oh ya, caranya berbeda loh dengan cara membuat breadcrumb yang dulu saya posting. Jadi lebih teliti lagi yah untuk penempatan kodenya :).

37 comments:

FIKRISHARE.COM - Free Download Software Full Version mengatakan...

mantab dah mas tutornya, dulu saya sempat menyepelekan penggunaan breadcumb. tapi setelah tahu khasiatnya sekarang jadi hal yang peling utama dipasang. ^_^

Deasfree Eula Downloads mengatakan...

Blog walking nih, Breadcrumb emang penting banget lo buat dongkrak blog kita hehe,,

ditogame mengatakan...

bams, qu kan make template bamz stile buatan mu, tolong donk share cara agar menu horizontalnya isi dropdown seperti menu horinzontal bwatan mu, kalo bsa, di bales ya :D

ofank fank mengatakan...

ko gak ada ya kkode seperti itu

Download Game PC Gratis mengatakan...

Ok, langsung pasang breadcrumbnyaa

BamZ Gz mengatakan...

@FIKRISHARE.COM - Free Download Software Full Version: kalau breadcrumb ini bagus untuk kontes seo , posting kontes masukkan saja ke label sesuai keyword kontes, nanti munculnya breadcrumb kan keyword kontes kwkwkw

BamZ Gz mengatakan...

@Deasfree Eula Downloads: yoi mas, memang di butuhkan :)

BamZ Gz mengatakan...

@ditogame: di blog ini sudah saya posting cara membuat menu horizontal

BamZ Gz mengatakan...

@ofank fank: masak g ada, ada kok. coba di koreksi lagi

BamZ Gz mengatakan...

@Download Game PC Gratis: sepertinya sudah sukses di pasang yah :) mantab

Free download software and sharing center mengatakan...

saya kok erorr ya gan .
padahal udah di ikutin bener-bener petunjuknya .
katanya :

"The widget with id "Blog1" contains at least two b:includable elements with the same id: "breadcrumb". All b:includable elements should have a unique id for a given widget." .

gimana dong?. ada saran gak ?

BamZ Gz mengatakan...

backup dulu templatenya. coba hapus breadcrumb yang ada biar g dobel. ulangi lagi langkahnya setelah menghapus breadcrumb biasanya

FIKRISHARE.COM - Free Download Software Full Version mengatakan...

weleh-weleh, saya gak kepikiran ke situ ya mas. edit post ah wkwkk. mas cekal penggunaan jvascpt blog saya agar elemen blog saya dapat di monitoring oleh mas.

BamZ Gz mengatakan...

kalau pake no script. bisa bingung malah mas, sebagian element kan pake js, kayak page navi, read more, dll. malah bingung mau liat elemen nya kwkakwakwka

ambassador rent makassar mengatakan...

thanks infonya mas sangatpenting buat kami
rental mobil makassar

BamZ Gz mengatakan...

okeh sama2 . sukses buat anda. :)

pakDE-Nanto mengatakan...

Css -nya kok nggak mempan yah ...

BamZ Gz mengatakan...

mungkin sudah ada css breadcrumbnya tuh pak de

Situs Berita Dunia Islam mengatakan...

gan,.. kalau diwordpress bagaimana tricknya,..

minta ilmunya dong gan..

Rudy Hartono mengatakan...

piye kabare mas bamz, suwi aku gak dolan nang blog sampeyan

Makal Media mengatakan...

ajib dah codingnya.. makasih mastah sharenya

Tukang Coding mengatakan...

ijin Jadi bahan rujukan di blog ane tretan.. ;)

No-Free Empire's Blog mengatakan...

ga, langsung nampak ya efeknya,,

kok saya ga nimbul " berapa lama efec nongol??

Lagu-share mengatakan...

Coba masang ini tapi di halaman google kok gak tampil ya?? :bingung

r3w4 mengatakan...

Gan, saya kan make B-Seo V2 punya Anda :) yang sudah ada breadcrumb nya, tapi mau pake yg ini, kode yang harus di hapus di themes B-Seo V2 itu mulai dari yang mana gan, soalnya saya coba hapus error mlulu. :)

Mohon pencerahannya gan, Thanks. :D

Ahmad Zainur Rifai mengatakan...

Gan ane pengguna template agan , kalo biar badcrums nya ke baca google gmana ya , ane udah nyoba tutorial diatas g jadi2 . mohon pencerahannya ,by : zherev.com

Robby mengatakan...

Oke gan,,aku coba deh..skalian ijin jalan2 diblog agan

>SEO Review And Education Blog - ZonaIde.com mengatakan...

Berhasil... Trimakasih Mas.....

Sāτū Hāτī Sāτū Cīŋτā mengatakan...

gan, judul artikel yg ad di breadcrumb ap mengikuti letak judul posting aslinya berada, tepat berada d atas judul posting?


Misalkan klo ada posting yg judul postingan nya berada d tengah, keterangan letak judul di breadcrumb akan brada d tengah jg ya, tepat d atas judul postingan?

Sāτū Hāτī Sāτū Cīŋτā mengatakan...

gan, judul artikel yg ad di breadcrumb ap mengikuti letak judul posting aslinya berada, tepat berada d atas judul posting?


Misalkan klo ada posting yg judul postingan nya berada d tengah, keterangan letak judul di breadcrumb akan brada d tengah jg ya, tepat d atas judul postingan?

SHARE AJA mengatakan...

Navigasi breadcrumb memang banyak membantu untuk proses crawler oleh Google search engine, thanks for sharing

Game pozt mengatakan...

Langsung ane praktekkan, thanks ya. SALAM KENAL Dari GAme Pozt

Obat Herbal Diabetes Melitus mengatakan...

kok gx ketemu2 kodenya yakh...atau bentuk kodenya lain...

liputantutor mengatakan...

nice info gan,,thnks dan salam persahabatan selalu

magazineticker mengatakan...

very good idea,,,thnks. visit me to

cerita tentang cinta mengatakan...

wehh mantab om,,
sekarang udah di index google breadcrump ane..

ZOPRAN MOBILE BLOG mengatakan...

saya sudah pasang di blog dan berhasil..

thanks sob sharenya..

Posting Komentar

Catatan: Hanya anggota dari blog ini yang dapat mengirim komentar.

◄ Posting Baru Posting Lama ►
 
Exit Di Like yah Sob!! Makasih