Membuat Breadcrumb-Navigation di Blog

Breadcrumb-navigation dapat membuat template kita lebih SEO friendly, karena akan mempermudah search engine menemukan artikel-artikel kita. Navigasi ini di kenal dengan nama breadcrumb-navigation. Tidak hanya itu dengan adanya breadcrumb-navigation maka pembaca dapat dengan mudah melihat posisi artikel yang di baca serta mencari artikel dalam satu kategori. breadcrumb-navigation bisa di pasang pada template blogger dengan sedikit modifikasi templatenya, dengan begitu breadcrumb-navigation akan lebih mudah jika langsung di praktekkan.

Langkah-langkah untuk memasang breadcrumb navigation adalah sebagai berikut:

• Login ke blogger.com
• Klik Tata Letak.
  
  
• Pilih tab Edit HTML
• Click Download Full Template (untuk back-up template anda - untuk kemungkinan terburuk akan merusak tatanan blog yang sudah anda rancang sebelumnya)
• Kemudian beri tanda centang Expand Template Widget.
• Silahkan cari kode ]]></b:skin>
• Copy lalu paste kode di bawah ini persis di atas kode ]]></b:skin>

.breadcrumbs {<br /> padding:5px 5px 5px 0px;<br /> margin: 0px 0px 15px 0px;<br /> font-size:95%;<br /> line-height: 1.4em;<br /> border-bottom:3px double<br /> #e6e4e3;<br /> }

• Kemudian cari kode berikut pada template anda :

<div class='post hentry uncustomized-post-template'>

• Copy lalu paste kode di bawah ini persis di bawah kode di atas ( kode <div class='post hentry uncustomized-post-template'>)

<b:if cond='data:blog.homepageUrl == data:blog.url'><br /> <b:else/><br /> <b:if cond='data:blog.pageType == "item"'><br /> <div class='breadcrumbs'><br /> Browse » <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a><br /> <b:loop values='data:posts' var='post'><br /> <b:if cond='data:post.labels'><br /> <b:loop values='data:post.labels' var='label'><br /> <b:if cond='data:label.isLast == "true"'> »<br /> <a expr:href='data:label.url' rel='tag'><data:label.name/></a><br /> </b:if><br /> » <span><data:post.title/></span><br /> </b:loop><br /> </b:if><br /> </b:loop><br /> <br /> </div></b:if><br /> <b:else/><br /> <b:if cond='data:blog.pageType == "archive"'><br /> <div class='breadcrumbs'>Browse » <a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/><br /> </div></b:if><br /> <b:else/><br /> <b:if cond='data:navMessage'><br /> <div class='breadcrumbs'><data:navMessage/><br /> </div></b:if><br /> </b:if>

• Kemudian Save Template.
• Tunggu beberapa saat sampai

Setelah selesai lihat pada posting anda tepatnya di atas judul artikel untuk menentukan berhasil tidaknya anda memasang breadcrumb-navigation.

Selamat mencoba....

Source : abdulroqib.blogspot.com