Cara Membuat Breadcrumb di Blog


Apa itu Breadcrumb? Breadcrumb adalah 'Link Berantai' yang menghubungkan halaman utama dengan halaman artikel dalam bentuk Navigasi. Jika dijabarkan seperti ini: Ketika membaca sebuah artikel, tentunya artikel tersebut berada dalam sebuah kategori/ label artikel tersebut, sementara kategori/label adalah fitur yang terdapat di halaman utama Blog (Home)
Cara Membuat Breadcrumb di Blog, cara membuat navigasi breadcrumb di blog, cara membuat link berjajar di blog  endolita.blogspot.com
Karena itu fungsi Breadcrumb adalah untuk menampilkan barisan link tersebut agar pengunjung bisa melihat artikel tentang apa yang dia baca. Lihat contoh gambarnya di bawah ini:
Cara Membuat Breadcrumb di Blog, cara membuat navigasi breadcrumb di blog, cara membuat link berjajar di blog  endolita.blogspot.com
Selain untuk mempermudah menavigasi sebuah halaman blog, fungsi Breadcrumb inipun cukup manjur untuk optimasi search engine terhadap blog kita. Bagaimana cara membuatnya?

Cara Memasang Breadcrumb di Blog:
  1. Login ke akun Blogger
  2. Pilih Template >> Edit HTML
  3. Letakkan script berikut tepat di atas kode ]]></b:skin>
  4. .breadcrumbs{
    padding:5px 5px 5px 0;
    margin:0;font-size:95%;
    line-height:1.4em;
    border-bottom:4px double #cadaef}
  5. Setelah itu, cari kode:
    <b:if cond='data:post.title'> atau,
    <b:if cond=&quot;data:post.title&quot;>
    Lalu letakkan kode berikut tepat di atasnya:
  6. <b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='breadcrumbs'><a expr:href='data:blog.homepageUrl'>Home</a> &#8250; <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast != &quot;true&quot;'> &#8250; </b:if> </b:loop> </b:if> &#8250; <data:post.title/> </div> </b:if> </b:if>
  7. Simpan Template
Itulah sekilas pemahaman saya tentang Cara Membuat Breadcrumb di Blog. Semoga bermanfaat. Jika mencari artikel lain yang serupa, silahkan cek di bawah ini:

Artikel Terkait

Cara Membuat Breadcrumb di Blog
4/ 5
Oleh

Berlangganan

Suka dengan artikel di atas? Silakan berlangganan gratis via email