Tutorial Cara Membuat Breadcrumbs Langsung Terindeks

Di artikel sebelumnya, saya sudah menulis tutorial cara membuat menu navigasi breadcrums di blog. Bagi anda yang membaca artikel ini tapi masih belum tahu tentang menu Navigasi Breadcrumbs, silahkan klik "Cara Membuat Breadcrumbs di Blog" untuk membaca penjelasan lengkap tentang breadcrumbs.

Membuat breadcrumbs di blog dengan mengikuti tutorial pada artikel tersebut, akan membuat breadcrumbs lama terindeks oleh mesin pencari terutama google. Biasanya hanya blog dengan PR minimal 3 yang akan breadcrumbsnya terindeks oleh google. Karena itu, saya akan memberikan tutorial gratis bagaimana agar breadcrumbs cepat terindex bahkan langsung terindeks.

Anda tidak perlu memiliki PR minimal 3 atau ratusan artikel. Anda hanya perlu memasang kode breadcrumbs pada template blog dan silahkan langsung buktikan hasilnya setelah membuat artikel baru atau memeriksa hasil serp artikel anda yang telah terindeks mesin pencari.

Tutorial cara membuat menu navigasi breadcrumbs  blogspot cepat terindeks google
Gambar 1 : Cara Membuat Breadcrums Terindeks


Cara Membuat Breadcrumbs Terindeks

Untuk membuat menu navigasi breadcrumbs terindeks, anda cukup menggunakan kode breadcrumbs yang telah di edit. Berikut tutorial dan kode breadcrumbs terindeks :
  • Apabila anda telah membuat breadcrumbs biasa dengan mengikuti tutorial di blogger Bugis, klik "Cara Membuat Breadcrumbs". Jika anda telah membuat breadcrumbs dengan mengikuti tutorial dari blogger  lain, cara memasangnya biasanya sama.
  • Masuk ke halaman kode template anda. Jika belum tahu caranya, klik "Cara Mengedit Template"
  • Hapus semua kode yang di pasang pada template di artikel tersebut lalu simpan template anda.
  • Cari kode  <b:includable id='main' var='top'>
  • Hapus kode tersebut dan ganti dengan kode berikut :
<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>
<b:includable id='main' var='top'>
    <b:include data='posts' name='breadcrumb'/> 
Selanjutnya.........
  • Cari kode ]]></b:skin> 
  • Letakkan kode CSS breadcrumbs terindeks berikut ini di atas kode tersebut :
.breadcrumbs{padding:8px 5px 5px 0;margin:10px 0 0px;font:normal 11px georgia; border-bottom:1px dashed #ccc;font-weight:normal}
  • Simpan Template anda
  • Selesai...
Anda mungkin akan lebih yakin dengan breadcrums yang cepat terindeks jika melihat gambar. Karena itu saya sertakan gambar screenshoot hasil serp artikel ini yang saya ambil beberapa menit setelah artikel ini saya posting lalu saya edit kembali untuk memasukkan gambarnya :

Tutorial cara membuat menu navigasi breadcrumbs  blogspot cepat terindeks google
Gambar 2 : Cara Membuat Breadcrums Terindeks

    Dengan membuat breadcrumbs cepat terindex, setidaknya salah satu optimasi seo blogspot telah di lakukan. Semoga setelah memasang breadcrumbs yang cepat terindeks oleh google ini akan membuat blog anda lebih cepat tampil di halaman depan hasil pencarian sehingga trafik pengunjung akan lebih banyak dari biasanya. Amien...

    Semoga bermanfaat...
    Have a nice day..