Cara Memasang Breadcrumb Google di Blogspot

Salam sukses selalu buat sobat semua, Belajar Komputer Melalui Internet saat ini akan sedikit membahas tentang Cara Memasang Breadcrumb Google di Blogspot dan semoga artikel ini bermanfaat.


Cara Memasang Breadcrumb Google di Blogspot ini memang sangat di anjurkan untuk meningkatkan kualitas blog kita pada mesin pencari, terutama mesin pencari google. sebagai mana hal ini talah disampaikan pihak google dalam "Search Engine Optimization Starter Guide"

kutipan Search Engine Optimization Starter Guide
Dalam panduan berbahasa indonesia disampaikan.
Gunakan navigasi "breadcrumb"- 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.
Meskipun pembuatan breadcrumb ini dianjurkan namun pada template bawaan blogger ini belum terpasang, nah untuk memasang breadcrumb pada template bawaan blogger maka ikuti tutorial dibawah ini;
contoh breadcrumb ;
contoh breadcrunb
 pada baris kedua itulah yang dinamakan breadcrumb

Langkah-langkah membuat breadcrumb:

Langkah pertama untuk memasang Breadcrumb Google tentu saja anda harus login dulu ke blognya kwkwk.
Seperti biasa, ke halaman design > edit HTML > Expand Widget Templates (jangan lupa selalu backup template sebelum editing)
Cari kode <b:include data='top' name='status-message'/> , biasanya ada 2 kode tersebut. Kalau sudah di temukan, silahkan paste kode berikut ini tepat di atasnya (paste aja di atas 2 kode yang anda temukan biar ga bingung).
<b:include data='posts' name='breadcrumb'/>
Sekarang cari kode <b:includable id='main' var='top'> dan kalau sudah ketemu, paste kode berikut tepat di atas kode <b:includable id='main' var='top'>
<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>

Simpan Template dan selesai, anda berhasil memasang breadcrumb google di blog anda.

Untuk mempercantik Breadcrumb google yang sudah anda pasang, sekarang tambahkan sedikit sentuhan Css berikut ini yang perlu anda tambahkan di atas kode ]]></b:skin>
.breadcrumbs{font-size:11px;margin-left:10px;padding: 5px 0;border-bottom: 1px dotted; line-height:1.4em;}

Mungkin sampai disini dulu Belajar Komputer Melalui Internet tentang Cara Memasang Breadcrumb Google di Blogspot kali ini, semoga bermanfaat bagi Anda.

DAPATKAN ARTIKEL VIA EMAIL

Masukan Alamat Email Sobat:

Delivered
feedburner

Dipublish oleh : Abdul Kohar - Jatinangor Rating 5 Belajar Komputer Melalui Internet, Updated at: 09:30

5 komentar :

  1. oia untuk h1 di blog saya memang sudah gak ada lagi karena diganti dengan logo di titel

    BalasHapus
  2. Kang saya sudah menerapkan tutor ini ke blog saya tapi kok breadcumbsnya tetep ga tampil ya ?mohon pencerahan ?

    BalasHapus
  3. terima kasih gan aku coba pasang ya breadcumbernya

    BalasHapus
  4. sob..di blog saya breadcrumbnya kok gak muncul ya?

    BalasHapus
Silahkan Tinggalkan jejak sobat, bila mau menggunakan emotion silahkan klik emotionnya kemudian copy dengan ctrl+c dan paste kodenya didalam kotak komentar...

close
GUESTBOOK
Google PageRank Checker Powered by  MyPagerank.Net
backlink
Dashboard
| Copyright © 2012 |
| Belajar Komputer Melalui Internet |
| Desain by: Abdul Kohar | Powered by: Blogger |