Cara Menambah Breadcrumb di Blogger

Breadcrumb. Saya yakin pasti banyak yang sudah akrab dengan kata ini. Breadcrumb sangat disukai oleh google karena dengan breadcrumb tampilan blog akan menjadi mudah untuk dijelajahi. Breadcrumb berfungsi sebagai penunjuk lokasi atau path dari halaman web yang sedang dikunjungi juga menampilkan halaman yang berada diatasnya. Dengan hal ini maka dapat menghindarkan pengunjung tersesat dalam menjelajahi web anda.

Tampilan breadcrumb akan berada di sebelah atas blog anda. ini dapat meningkatkan pagerank blog anda karena dengan ini memungkinkan pengunjung untuk lebih banyak membuka artikel artikel anda.

Gambar diatas adalah contoh dari breadcrumb. dan berikut adalah contoh dari breadcrumb artikel ini:

Home >> Blog >> SEO >> Cara menambahkan Breadcrumb di Blog

Berikut adalah cara pemasangan breadcrumb pada Blog:

• Login ke blog anda, masuk ke Rancangan kemudian Edit HTML.
• Centang pada Expand Template Widget.
• Cari kode ]]></b:skin> (gunakan Ctrl + F untuk memudahkan pencarian) lalu letakan kode dibawah ini tepat diatas kode  ]]></b:skin>

.breadcrumbs{ margin-left:10px; padding: 5px 0; border-bottom: 1px dotted; line-height:1.4em; }

• Kemudian cari kode <b:include data='top' name='status-message'/> biasanya akan terdapat dua kode tersebut. Dan letakan kode dibawah ini tepat diatas kedua kode  <b:include data='top' name='status-message'/> tersebut.

<b:include data='posts' name='breadcrumb'/>

• Langkah selanjutnya cari kode <b:includable id='main' var='top'> dan letakan kode dibawah ini tepat diatas 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 == "static_page"'> <div class='breadcrumbs'> <span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span><data:blog.pageName/></span></div> <b:else/> <b:if cond='data:blog.pageType == "item"'> <!-- 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'> » <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span> </b:loop> » <span><data:post.title/></span> </div> <b:else/> <div class='breadcrumbs'> <span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div> </b:if> </b:loop> <b:else/> <b:if cond='data:blog.pageType == "archive"'> <!-- breadcrumb for the label archive page and search pages.. --> <div class='breadcrumbs'> <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Archives for <data:blog.pageName/></span> </div> <b:else/> <b:if cond='data:blog.pageType == "index"'> <div class='breadcrumbs'> <b:if cond='data:blog.pageName == ""'> <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>All posts</span> <b:else/> <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Posts filed under <data:blog.pageName/></span> </b:if></div> </b:if></b:if> </b:if> </b:if> </b:if> </b:includable>

• Kemudian

• Jika anda mau melihat dan mengetahui apakah Breadcrumb yang anda buat terindex oleh Google atau tidak bisa anda cek disini http://www.google.com/webmasters/tools/richsnippets
• Selamat mencoba. 

  source: http://www.adib21.com/2012/04/cara-menambahkan-breadcrumb-pada-blog.html

Artikel ini diposting oleh : Al-Ly Oman | ABC education

Anda telah membaca sebuah artikel yang berjudul Cara Menambah Breadcrumb di Blogger. Semoga ulasan pada artikel ini memberi manfaat, dapat menambah wawasan keilmuan dan pengetahuan Anda.

:: Terima kasih telah berkunjung di ABC education ::