Cara Membuat Navigasi Breadcrumbs Blogger Ultimate SEO


Breadcrumbs adalah Navigasi yang memudahkan visitor sekaligus SEO Friendly, Breadcrumbs ini terletak di atas postingan blog, yang menghiasi blog layaknya seperti di window explorer, ada navigasinya... tapi, bukan cuma ini kegunaannya, justru Google lebih memerhatikan blog yang mempunyai Breadcrumbs ini.

simak nih... penjelasan dari si mbah google :

"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".

agak ngaco ya.. bahasa-ne banyak yang kaku... wew, itu mungkin gara2 di translate kali.. he... CMIW
jika ingin blog anda mejeng di pejwan, silahkan pasang widget breadcurumbs in

Ok. Follow Up tutorial ini gan:
  1. Sign in ke akun Blogspot Anda
  2. Pilih layout > Edit Html
  3. Backup/download template Anda sebelum melakukan perubahan.
  4. Beri tanda centang pada Expand the Widget Templates
  5. Cari kode kyak ini :
    <b:include data='top' name='status-message'/>
  6. copy kode dibawah ini tepat dibawah kode diatas :

    <b:include data='posts' name='breadcrumb'/>
  7. Lalu cari kode seperti ini :
    <b:includable id='main' var='top'>
  8. dan copy paste kode dibawah ini tepat diatasnya :

    <b:includable id='breadcrumb' var='posts'>
    <b:if cond='data:blog.homepageUrl == data:blog.url'>
    <!-- No breadcrumb on home page -->
    <b:else/>
    <b:if cond='data:blog.pageType == "item"'>
    <!-- breadcrumb for the post page -->
    <p class='breadcrumbs'>
    <span class='post-labels'>
    <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
    <b:loop values='data:posts' var='post'>
    <b:if cond='data:post.labels'>
    <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:else/>
    »Unlabelled
    </b:if>
    » <span><data:post.title/></span>
    </b:loop>
    </span>
    </p>
    <b:else/>
    <b:if cond='data:blog.pageType == "archive"'>
    <!-- breadcrumb for the label archive page and search pages.. -->
    <p class='breadcrumbs'>
    <span class='post-labels'>
    <a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/>
    </span>
    </p>
    <b:else/>
    <b:if cond='data:blog.pageType == "index"'>
    <p class='breadcrumbs'>
    <span class='post-labels'>
    <b:if cond='data:blog.pageName == ""'>
    <a expr:href='data:blog.homepageUrl'>Home</a> » All posts
    <b:else/>
    <a expr:href='data:blog.homepageUrl'>Home</a> » Posts filed under <data:blog.pageName/>
    </b:if>
    </span>
    </p>
    </b:if>
    </b:if>
    </b:if>
    </b:if>
    </b:includable>
  9. dan terakhir, cari kode seperti ini :
    ]]></b:skin>
  10. Kemudian copy paste kode CSS dibawah ini diatas kode diatas :
    .breadcrumbs {
    padding:5px 5px 5px 0px;
    margin: 0px 0px 15px 0px;
    font-size:95%;
    line-height: 1.4em;
    border-bottom:3px double #e6e4e3;
    }

  11. Tekan tombol "Save/Simpan".
Tunggu dua-tiga hari sampai  mesin google mendeteksi breadcrumbs kita. dan taraa.. lihatlah di search engine, blog kita semakin bagus.. wew.. sekian dan terimakasih

Anda sedang membaca artikel tentang Cara Membuat Navigasi Breadcrumbs Blogger Ultimate SEO dan anda bisa menemukan artikel Cara Membuat Navigasi Breadcrumbs Blogger Ultimate SEO ini dengan url http://sevenfrogz.blogspot.com/2012/09/cara-membuat-navigasi-breadcrumbs.html,anda boleh menyebar luaskannya atau mengcopy paste-nya jika artikel Cara Membuat Navigasi Breadcrumbs Blogger Ultimate SEO ini sangat bermanfaat bagi teman-teman anda,namun jangan lupa untuk meletakkan link Cara Membuat Navigasi Breadcrumbs Blogger Ultimate SEO sebagai sumbernya.

Share it to your friends..!

Share to Facebook Share this post on twitter Bookmark Delicious Digg This Stumbleupon Reddit Yahoo Bookmark Furl-Diigo Google Bookmark Technorati Newsvine Tips Triks Blogger, Tutorial SEO, Info

0 komentar:

Post a Comment

Related Posts Plugin for WordPress, Blogger...