Kumpulan Tips & Trik Seputar Teknologi

Wednesday 11 March 2015

Tutorial Mudah Cara Membuat Breadcrumb Terindex Oleh Google

Tutorial Mudah Cara Membuat Breadcrumb Terindex Oleh Google Rating: 4.5 out of 5 1

Tutorial Mudah Cara Membuat Breadcrumb Terindex Oleh Google - Breadcrumb adalah navigasi untuk memudahkan pengunjung web/blog mengetahui lokasi kontent dalam suatu website/blog. Breadcrumb biasanya terletak di atas post body web/blog dan di bawah header. breadcrumb merupakan komponen penting dalam web/blog breadcrumb juga berperan aktif pada optimasi seo onpage suatu web/blog,  hingga ada yang mengatakan template blog/web belum bisa di katakan seo friendly jika belum ada breadcrumb di dalamnya. bagi anda yang di blog nya belum di pasang breadcrumb bisa ikuti tutorial di bawah.

Fungsi breadcrumb  adalah Menunjukkan lokasi konten dari halaman web yang sedang dikunjungi agar mereka [Pengunjung] tahu lokasi konten tersebut di dalam web yang di  bukanya.

Tutorial Mudah Cara Membuat Breadcrumb Terindex Oleh Google

Intinya suatu breadcrumb itu berfungsi menunjukan hirarki atau tingkatan konten yang ada di suatu blog atau website atau bisa juga di sebut konten tersebut di kelompokan dalam kategori apa, contohnya jika sebuah blog mempunai konten yang di letakan pada label/tag blogging maka jika breadcrumb terindex oleh google breadcrum akan tampak hirarki www.domainmu.com → Tag/Label → Judul Konten.

Nah kurang lebih seperti itu penjelasan mengenai breadcrumb. Jika anda belum menerapkan breadcrumb di sarankan segera untuk menerapkan breadcrumb, kembali lagi breadcrumb merupakan bentuk optimasi seo on page untuk blog anda.

Breadcrumb yang baik itu breadcrumb  yang dapat di rayapi oleh google atau dapat di index oleh google  maka pada tutorial kali ini saya akan memberikan source code untuk membuat breadcrumb yang dapat terindex oleh google.  langsung saja ikuti langkah-langkahnya di bawah ini.

Tutorial Mudah Cara Membuat Breadcrumb Terindex Oleh Google

1. Masuk Dasbor  Blog anda  kemudia masuk Template dan edit html

2. Kopy code CSS di bawah ini tepat di atas kode </b:skin>

.breadcrumbs {
font-size:14px;
color:#666;
padding:15px;
margin:0 0 15px;
background:#ffffff;
border:1px solid #f0f0f0;
}


3. Kemudian Copy dan Replace kode Html di bawah ini tepat pada tag  <b:includable id='breadcrumb' var='posts'> sampai tag penutup  </b:includable>, bagi anda yang belum pernah memasang breadcrumb maka cari kode  <div class='post hentry'> kemudian letakkan kode di bawah ini tepat di bawah kode tersebut.

<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='nofollow'>Home</a></span> &#187; <span><data:blog.pagename/></span>
</div>
<b:else/><b:if cond='data:blog.pageType == &quot;item&quot;'><b:loop values='data:posts' var='post'><b:if cond='data:post.labels'>
<div class='breadcrumbs'>
 <span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='title'>Home</span></a></span> &#187; <b:loop values='data:post.labels' var='label'><span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:label.url + &quot;?&amp;max-results=8&quot;' itemprop='url'><span itemprop='title'><data:label.name/></span></a></span><b:if cond='data:label.isLast != &quot;true&quot;'>&#187;</b:if></b:loop> &#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'>
 <span><a expr:href='data:blog.homepageUrl' rel='nofollow'>Home</a></span> &#187; <span>Uncategories</span> &#187; <span><data:post.title/></span>
</div>
</b:if></b:loop><b:else/><b:if cond='data:blog.pageType == &quot;archive&quot;'>
<div class='breadcrumbs'>
 <span><a expr:href='data:blog.homepageUrl' rel='nofollow'>Home</a></span> &#187; <span>Archive for <data:blog.pagename/></span>
</div>
<b:else/><b:if cond='data:blog.searchQuery'>
<div class='breadcrumbs'>
 <span><a expr:href='data:blog.homepageUrl' rel='nofollow'>Home</a></span> &#187; <span><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' rel='nofollow'>Home</a></span> &#187; <span>All post</span><b:else/><span><a expr:href='data:blog.homepageUrl' rel='nofollow'>Home</a></span> &#187; <span><data:blog.pagename/></span></b:if>
</div>
</b:if></b:if></b:if></b:if></b:if></b:if></b:includable>

4. Kemudian Simpan.  Reload untuk melihat hasilnya.

Demikian tutorial mudah cara membuat breadcrumb terindex oleh google semoga bermanfaat untuk anda.  jika ada yang belum jelas silahkan tinggalkan komentar anda di bilah komentar yang di sediakan.

2 Responses to "Tutorial Mudah Cara Membuat Breadcrumb Terindex Oleh Google"

  1. no 3 tidak ada di template saya gan, solusinya gimana?

    ReplyDelete
    Replies
    1. silahkan di lihat lagi yang no 3 gan sudah saya update, solusi yang belum pernah memasang breadcrumb.

      Delete

Silahkan berkomentar sesuai dengan topik pada artikel di atas. Dengan ketentuan di larang Menyisipkan Link pada komentar, Berkomentar dengan berlebihan atau SPAM, Promosi dan sebagainya.

Terimakasi telah mematuhi peraturan di Blog ini. Sebagai rasa terimakasih Tentu saya akan berkunjung kembali ke blog Anda.