Cara Memasang Breadcrumb

Ini merupakan trik sederhana untuk memasang Breadcrumb, atau link navigasi untuk menjelaskan posisi artikel dalam blog Anda. Breadcrumb sangat membantu pengunjung blog Anda untuk mengetahui letak artikel berada pada jenis atau kategori artikel apa. Disamping itu, konon breadcrumb juga sangat familiar dengan mesin pencari seperti Google. Artinya, setiap kata kunci breadcrumb, membantu Anda untuk memperkenalkannya kepada mbah Google. Oke, langsung saja menuju TKP dengan mengikuti tahapan berikut.

Pertama, masuk ke account blogger Anda, dan menuju ke halaman edit HTML. Jangan lupa untuk centang atau "Expand Widget Template". Lalu masukkan kode CSS dibawah ini :

.breadcrumbs { padding:15px 5px 5px 0; margin:0;font:normal 12px Arial; line-height:1.6em; border-bottom:3px double #ddd}

Kedua, cari kode HTML <b:if cond='data:post.title'> (jika Anda bingung, cukup menekan tombol Ctrl + F  di keyboard komputer/laptop Anda untuk mencari kode).

Ketiga, Anda harus menambahkan kode HTML breadcrumb untuk menjalankan fungsi navigasi. Masukkan kode dibawah ini tepat di atas kode di atas tadi :

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

Selesai, silahkan simpan template Anda, dan lihat hasilnya. Kini setiap artikel blog Anda memiliki kode navigasi breadcrumb.

Posted in: Tutorial Blogspot