Saturday, February 20, 2010

Wajib Pakai Breadcrumbs Navigasi

Sudahkah blog anda dipasangin breadcrumbs? buat sobat blogger yang pengen lebih mengoptimalkan blognya agar lebih seo friendly dan user friendly salah satunya dengan memasang breadcrumbs navigasi. Sengaja saya mewajibkan, berhubung saya telah merasakan manfaatnya. Sekedar berbagi sesama newbie belajar SEO, berikut tutorial cara membuat breadcrumbs navigasi yang saya gunakan pada blog ini. Cara ini adalah salah satu dari cara yang orang pakai di blognya.




Lewat berita yang saya baca di Internet bahwa google sudah dapat membaca dan memahami data breadcrumbs blog kita jadi jangan heran bila mendapati ada sebuah blog pada hasil pencarian (SERP) url nya malah yang ditampilkan kategorinya. Seingatku ketika akhir tahun lalu, november 2009. Saya mendapati beberapa url blog ku malah yang ditampilkan di SERP adalah halaman kategorinya. Sampai sekarang semakin banyak, bahkan hampir semua kategori data breadcrumbs ku dibaca oleh google di SERP, coba search di google ketik > Site:http://10beritaterbaru.blogspot.com/.

Awalnya saya jadi malah heran dan takut kok blog saya jadi gini, tapi lama kelamaan ternyata memang terbukti bahwa breadcrumbs yang saya pasang di blog saya berguna banget pada hasil pencarian google. Dan alhamdulillah kini sudah banyak halaman blog saya berada di top 1 google SERP berkat pemasangan breadcrumbs navigasi seo ini.

Ok, jika sobat berminat berikut adalah cara memasang breadcrumbs seo navigasi di blog anda, cara ini adalah yang saya gunakan di blog Pancallok. Anda juga bisa menggunakan cara lain, googling aja yah :D

1. Masuk ke Layout > Edit HTML > checklist Expand Widget Templates. Sebaiknya download dulu templatenya untuk safety nya.
2. Copy kode css berikut lalu pastekan sebelum kode ini </b:skin>

.breadcrumbs{border-bottom:1px dotted #999;margin:2em 0 0.5em;padding:0 0 0.5em;font-size:10px}

3. Kemudian cari kode ini <b:includable id='main' var='top'> dan taruh kode berikut pas di atas kode tadi.

<b:includable id='breadcrumbs' var='post'>
<!-- Breadcrumbs By Pancallok http://10beritaterbaru.blogspot.com -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:post.labels'>
Go&#160; :
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> &gt;
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == &quot;true&quot;'>
<a expr:href='data:label.url' rel='tag'> <data:label.name/></a>
</b:if>
</b:loop>
<b:if cond='data:post.title'>
&gt; <b><data:post.title/></b>
</b:if>
</b:if>
</span>
</p>
</b:if>
<!-- End of Breadcrums Hack -->
</b:includable>

4. Lalu cari kode ini <b:loop values='data:posts' var='post'> (biasanya ada 2 kode yg sama pilih kode yang pertama) dan taruh kode berikut pas di bawah kode tadi

<b:include data='post' name='breadcrumbs'/>

5. Save Template

Jika cara di atas tidak berhasil juga anda lakukan, coba pakai cara lain. Langsung googling aja pasti nemu,hihiih...semoga bermanfaat...

No comments:

Post a Comment