Cara Membuat Breadcrumbs SEO Friendly di Blog

Cara Membuat Breadcrumbs SEO Friendly di Blog - Apalah arti sebuah blog tanpa dilakukanya search engine optimization, karena pada hakikatnya SEO adalah alat terampuh untuk mendatangkan banyak pengunjung dari mesin pencari. Bagi sebagian blogger, nampaknya SEO sudah mereka jadikan sebagai kewajiban sekaligus kebutuhan, karena menurut mereka search engine adalah sarana terbaik dan paling potensial dalam mendongkrak traffik blog. Sebenarnya ada banyak sekali cara yang dapat kita lakukan untuk memaksimalkan upaya SEO, salah satunya adalah dengan memasang breadcrumbs di blog, karena secara tidak langsung tools ini akan membantu kinerja robot mesin pencari dalam memaksimalkan target keywords yang kita bidik dalam setiap postingan, dan tidak hanya itu, breadcrumbs seo friendly kali ini adalah breadcrumbs yang didesain untuk menampilkan beberapa label dalam setiap postingan yang kita publikasikan, jadi nanti pada saat artikel kita terindeks dan muncul pada hasil pencarian mesin pencari, dibawah artikel akan muncul beberapa label yang sudah kita 'mandatkan' kepada setiap artikel tersebut, karena ada juga kode script breadcrumbs yang hanya menampilkan 1 label di hasil pencarian mesin pencari, padahal kita memberikan beberapa label pada postingan tersebut, itulah sebabnya breadcrumbs kali ini lebih SEO friendly dan bersahabat bagi robot search engine, tentunya karena dapat menampilkan keywords dari label 'lebih' banyak ketimbang yang memunculkan hanya 1 label/kategori di mesin pencari.

Bagi anda yang belum tahu tentang breadcrumbs saya akan coba sedikit jelaskan, jadi breadcrumbs adalah navigasi berbentuk hiraki yang terletak di atas postingan, dan di dalam sebuah website breadcrumbs ini dijadikan sebagai navigasi postingan. Selain digunakan untuk memaksimalkan upaya SEO, widget ini juga biasa digunakan para blogger untuk mengindikasikan/memberitahukan kepada pengunjung dimana mereka sekarang berada (di dalam website kita). Selain itu, sebenarnya masih banyak lagi keuntungan dari menerapkan breadcrumbs di blog, diantaranya adalah memperkecil bounce rate dan memberi 'kode' kepada search engine apa kata kunci yang sebenarnya kita 'targetkan' pada suatu postingan. 

Ide SEO Breadcrumbs ini saya dapatkan setelah saya mengunjungi blog kang Ismet, salah satu teman yang nampaknya sudah tidak asing lagi di telinga kita para blogger. Well, inilah cara membuat breadcrumbs SEO Friendly di blog, bagi anda yang berminat, silahkan disimak yang berikut ini.

1. Login ke Blogger.

2. Pilih Template.

3. Klik Edit HTML > Lanjutkan.

4. Centang box 'Expand Template Widget'.

5. Cari kode ]]></b:skin> menggunakan CTRL+F.

6. Letakkan kode di bawah ini tepat di atas ]]></b:skin>.

.breadcrumbs{
padding:0px 5px 5px 0;
margin-bottom:20px;
font-size:11px;
color:#5B5B5B;
border-bottom:1px dotted #bbb;
}

7. Masih di Edit HTML, cari kode seperti dibawah ini.

  <b:includable id='post' var='post'>
  <div class='post'> 

8. Lalu, letakkan kode berikut ini tepat dibawah kode diatas.

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag' title='Home'>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' title='Home'>Home</a></span>
<b:loop values='data:post.labels' var='label'>
 &#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' expr:title='data:label.name' 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' title='Home'>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' title='Home'>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' title='Home'>Home</a></span> &#187; <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></span> &#187; <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>

7. Klik 'save template', dan selesai.

Bagaimana? mudah bukan memaksimalkan SEO blog dengan cara membuat breadcrumbs SEO Friendly. Baca juga artikel blogging tentang cara menghilangkan tulisan langganan entri (atom), agar blog kita terlihat rapi dan proffessional di mata pengunjung. Demikian tutorial blog tentang cara membuat breadcrumbs SEO friendly di blog, semoga bermanfaat, dan selamat mencoba. Happy Nice Blogging... Salam Hangat...