Cara Membuat Menu Breadcrumbs Di Blogspot

Diposkan oleh Muhammad Oka on Senin, 09 Januari 2012

Kembali lagi bersama saya PengelanaCyber
Udah sekian lama ini saya kagak Posting di blog kumuh ini . soalnya kemarin pensiun dulu karena ada kesibukan ulangan .

Nah sekarang kembali lagi bersama saya PengelanaCyber disini saya akan membagikan sedikit tutorial kepada sobat blogger yang dapat sedikit menunjang ke SEO-an blogger sobat tutorialnya adalah Menu Breadcrumbs .
Tutorial kali ini dipercaya dapat menunjang ke SEO-an blogspot kita walaupun sedikit , hehe :)
Ni Saya kasih Contohnya biar gak penasaran :
Menu Breadcrumbs,Breadcrumbs Hack,Menu Breadcrumbs Blogspot,SEO Breadcrumbs


Langsung saja tanpa bacotan lagi , cara membuatnya gak susah kok  kita gak perlu pake minyak goreng dan sebagainya yang kita perlukan adalah ketelitian kita .
Silakan Ikuti Langkah - Langkah Dibawah ini :

  • Langkah pertama login ke account Blogger Sobat kemudian pastikan kalo semua Postingan sobat sudah dibuat Labelnya.
  • Kalo sudah mari kita buat Menu Breadcrumbs nya , silakan sobat blogger buka Rancangan Kemudian buka Edit HTML .
  • Setelah dibuka jangan lupa centang Expand Widgets Template dan cari kode dibawah ini (Gunakan CTRL + F biar cepet nyarinya ) :
<b:includable id='main' var='top'>
  • Sudah ketemu sobat blogger ? kalo sudah letakan kode dibawah ini tepat diatasnya :

<b:includable id='breadcrumbs' var='post'>
<!-- Menu Breadcrumbs - http://pengelanacyb3r.blogspot.com/ -->
  <b:if cond='data:blog.pageType == "item"'>
      <p class='breadcrumbs'>
      <span class='post-labels'>
        <b:if cond='data:post.labels'>

          Browse:
          <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>  &gt;
          <b:loop values='data:post.labels' var='label'>
            <b:if cond='data:label.isLast == "true"'>
              <a expr:href='data:label.url' rel='tag'> <data:label.name/></a>
            </b:if>
          </b:loop>
          <b:if cond='data:post.title'>
&gt;  <b><data:post.title/></b>
          </b:if>

        </b:if>
      </span>
      </p>
  </b:if>
<!-- End of Breadcrums Hack -->
</b:includable>
  • Udah dipastekan ? kalo udah cari lagi kode dibawah ini sobat blogger biasanya kode ini ada 3 :
<b:if cond='data:post.dateHeader'>
  • Kalo udah ketemu Pastekan kode dibawa ini tepat diatasnya ingat sobat tepat diatasnya :
<b:include data='post' name='breadcrumbs'/>
  • Nah ampir selesai sobat blogger , langkah terakhir cari kode ]]></b:skin> kalo udah ketemu letakan kode CSS dibawah ini :
.breadcrumbs {
border-bottom:1px dotted #000;
margin:2em 0 0.5em;
padding:0 0 0.5em;
}
Selesai deh Menu Breadcrumbs sobat blogger sudah jadi , sekian dari saya PengelanaCyber jika ada kesusahan dalam tutorial ini boleh tinggalkan pesan insya allah PengelanaCyber akan bantu :)

{ 7 komentar... read them below or add one }

Tagantar Dot Com mengatakan...

Mantap gan.. !!
izin nyimak y ..!

:) Happy Blogging Sahabatku..!

PengelanaCyber mengatakan...

tagantar : silakan gan , semoga bermanfaat
happy blogging :)

Kazim zazuli mengatakan...

mantap nich,,,, thanks gan,,

Syahrul Akbar mengatakan...

THX Banget!!!

Ramzi Ebaz mengatakan...

Kalo ada menu breadcrumb, template jadi makin seo ya mas bro
nice share :)

Liya Alicia mengatakan...

mantab artikelnya sob
http://ramuantradisionalkita.com/pengobatan-tradisional-kanker-usus/

chepi tridiatna mengatakan...

nice post

Poskan Komentar