Membuat Breadcrumbs Yang Valid

Posted on Senin, 21 Oktober 2013

Breadcrumbs merupakan salah satu navigasi situs yang akan membantu pengunjung untuk menemukan artikel dalam kategori atau label yang sama dengan mudah, dengan memasang breadcrumbs yang valid juga akan membuat kategori atau label artikel yang kita posting terlihat dan ter-indeks pada mesin pencari

Berikut ini merupakan cara membuat breadcrumbs yang valid sehingga dapat ter-indeks oleh Google dengan baik :

1. Login kedalam blogger lalu masuk ke bagian template dan pilih edit HTML

2. Gunakan tombol Ctrl+F untuk mencari kode seperti ini </b:skin> lalu letakan kode dibawah ini diatas tulisan </b:skin>

.breadcrumbs{padding:0 5px 5px 0;margin:0 0 5px;font-size:11px;border-bottom:1px dotted #ccc;font-weight:normal}

3. Selanjutnya cari kode yang seperti ini : <b:includable id='main' var='top'> setelah ketemu, gantikan dengan kode berikut ini :

<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'>&#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span></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><b:includable id='main' var='top'><b:include data='posts' name='breadcrumb'/>

4. Silahkan save template anda yang sudah dimodifikasi. Untuk mengetahui apakah breadcrumbs yang valid telah terpasang dengan benar atau belum gunakan Rich Snippets tools dari Google di sini Google.com/webmasters/tools/richsnippets.

1 komentar: