SERBA-SERBI :

Cara Memasang Breadcrumbs di Blogger

Ditulis oleh Andre pada hari Selasa, 10 April 2012 | 22.51

Merupakan hal yang penting bagi kita para blogger yang ingin mengoptimalkan blognya pada mesin pencari dengan cara memasang Breadcrumbs di blog. Apakah itu Breadcrumbs? Breadcrumbs adalah fitur yang berguna untuk memperpendek alamat posting URL blog dengan judul label dari posting tersebut. Masih kurang jelas? Lihat screenshot dibawah ini.



Lihat, dibawah judul artikel ada tulisan www.andrepanggabean.com > Ilmu Pengetahuan Alam. Nah, itulah yang dimaksud dengan Breadcrumb.

Dengan memasang Breadcrumbs tentunya akan membuat blog kita terlihat rapi di halaman hasil pencarian sekaligus memberikan kesan 'Profesional'.

Untuk memasang Breadcrumbs di Blogger sangatlah mudah, ikuti langkah berikut ini.

  1. Login ke akun Blogger sobat.
  2. Klik pada Rancangan -> Edit HTML . Lalu beri tanda centang pada Expand Widget Template.
  3. Sebelum mengedit, backup terlebih dahulu template sobat, klik Download Template Lengkap.
  4. Cari kode ini di template sobat <b:include data='top' name='status-message'/> . Biasanya ada dua kode. Jika sudah ketemu, paste-kan kode dibawah ini tepat diatas kode sebelumnya.
  5. <b:include data='posts' name='breadcrumb'/>
  6. Sekarang cari kode <b:includable id='main' var='top'>. Jika sudah ketemu, copy dan paste kode dibawah ini tepat diatasnya.
  7. <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'>
     &#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
    </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>
  8. Selesai. Simpan template sobat. Klik Simpan Template

Nah, efek dari Breadcrumb ini sudah bisa sobat rasakn pada artikel sobat yang baru. Silahkan posting artikel apa saja, dan lihat efek dari breadcrumb ini. Efeknya juga akan terlihat pada posting-posting sebelumnya, hanya saja akan terlihat dalam beberapa hari.
Share this article :

Artikel Terkait:

0 komentar:

Posting Komentar

 
Copyright © 2011. Galeri Bocah - by Andry Andreas Panggabean | Blog Belajar SEO | Optimasi Blog di Google
Template Modify by Creating Website Inspired Wordpress Hack
Proudly powered by Blogger