Warung Bebas

Sabtu, 17 Maret 2012

Cara Pasang Navigasi Breadcrumbs di Blog






Navigasi Breadcrumbs . memang hampir semua pengguna blog memasang yang namanya navigasi yang satu ini. Kata banyak orang + master , navigasi Breadcrumbs ini sangat disukai oleh mesin pencari Google yaitu (SERP).Bagi yang pingin tau apa arti dari Breadcrumbs , ini saya berikan pengertiannya :

Breadcrumb adalah sebaris tautan internal pada bagian atas atau bawah laman yang memungkinkan pengunjung untuk menavigasi balik ke bagian sebelumnya atau ke laman dasar dengan cepat. Banyak breadcrumbs memiliki laman yang paling umum (biasanya laman dasar) sebagai tautan pertama dan paling kanan dan memuat bagian yang lebih spesifik keluar ke sisi kanan.

Keuntungan yang didapat dari memasang breadcrumbs ini kita dapat bersaing untuk mendapatkan posisi teratas di mesin pencari google karena kategori dalam postingan kita akan terindeks oleh mesin pencari dan juga blog kita akan lebih SEO.

Untuk lebih jelasnya kita langsung ke praktik pemasangan navigasi satu ini :

  • Masuk ke Layout > Edit HTML > checklist Expand Widget Templates.

  • Sebelum mengedit template Anda, Anda mungkin ingin menyimpan sebuah salinan dari template tersebut. Download Template terlebih dahulu.

  • Copy Paste kode berikut sebelum kode ini ]]></b:skin>

    .breadcrumbs{border-bottom:1px dotted #999;margin:2em 0 0.5em;padding:0 0 0.5em;font-size:10px}

  • Cari kode <b:includable id='main' var='top'> copy paste kode dibawah ini letakkan di atas kode <b:includable id='main' var='top'>

    <b:includable id='breadcrumbs' var='post'>
    <!-- Breadcrumbs By Warung Seo http://kutak-ketik.blogspot.com -->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <p class='breadcrumbs'>
    <span class='post-labels'>
    <b:if cond='data:post.labels'>
    Go&#160; :
    <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 == &quot;true&quot;'>
    <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>

  • Selanjutnya cari kode <b:loop values='data:posts' var='post'> (biasanya ada 2 atau 3 kode yg sama   pilih kode yang pertama untuk yang 2 kode yang sama, sedangkan untuk yang 3 kode yang sama pilih yang kedua) dan copy paste kode berikut dan letakkan di bawah kode <b:loop values='data:posts' var='post'>

    <b:include data='post' name='breadcrumbs'/>
  • Simpan Template dan lihat hasilnya

0 komentar em “Cara Pasang Navigasi Breadcrumbs di Blog”

Posting Komentar

 

TIPS TRIK Copyright © 2012 Fast Loading -- Powered by Blogger