April 18, 2012

Cara Memasang Navigasi Breadcrumb SEO Friendly

Navigasi-Breadcrumb-Blogger
Cara Memasang Navigasi Breadcrumb SEO Friendly. Breadcrumb dalam istilah Blogger adalah bantuan navigasi menu yang digunakan dalam user interface untuk mempermudah para user menavigasi halaman web/blog kita.

Selain untuk mempermudah user dalam menavigasi web/blog kita, ada lagi satu keuntungannya yaitu juga di senangi robot google yang mengcrawl halaman weblog.

Navigasi Breadcrumb di Blogger, Menurut para master, bisa meng-Optimasi Blogspot atau membantu blog agar menjadi lebih SEO Friendly.

Breadcrumbs juga bisa memudahkan pengunjung dalam menavigasi tiap halaman blog dan tentunya hal ini juga akan menguntungkan bagi kita dalam tujuan untuk meningkatkan page views visitors di blog kesayangan.

Cara Memasang Navigasi Breadcrumb SEO Friendly Berikut Tahapannya :

1.Login di account blogger.com
2.Halaman Rancangan
3.Edit HTML.
4.Centang kotak kecil pada bagian Expand Template Widget
5.Letakkan kode CSS berikut tepat di atas kode ]]></b:skin>

.breadcrumbs{
padding:5px 5px 5px 0;
margin:0;font-size:95%;
line-height:1.4em;
border-bottom:4px double #cadaef}

6.Setelah itu cari kode <b:if cond='data:post.title'> atau jika tidak menemukan coba cari kode <b:if cond=&quot;data:post.title&quot;> lalu letakkan kode berikut tepat diatasnya

<b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='breadcrumbs'> Browse &#8250; <a expr:href='data:blog.homepageUrl'>Home</a> &#8250; <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast != &quot;true&quot;'> &#8250; </b:if> </b:loop> </b:if> &#8250; <data:post.title/> </div> </b:if> </b:if>

7.Save/Simpan hasil editan template.
8.Selesai

Catatan :
  • size:95% sesuaikan besar untuk tampilan huruf yang kita inginkan.
  • Home warna biru dapat di ganti untuk judul blog kita Misalnya kami menggunakan Laurencius
  • Hasil dari tampilan tutorial ini bisa dilihat pada tampilan Breadcrumb di blog ini

Selamat Mencoba Semoga Manfaat.

Related Posts

Cara Memasang Navigasi Breadcrumb SEO Friendly
4/ 5
Oleh :

6 comments

kunjungan malam sobat.., sambil nyimak..., :)

@Rohis Facebook
Makasih Kang.


@just copy and leave it
Siapa tahu ada yg memerlukan Kang.

SS nya kok endak di tampilkan mas??

wah ini kayanya mana contohnya. kaya gini bukan gan?

@cerita anak kost
Contohnya yang diatas Judul artikel Kang.

memang nampak menarik, tp sayangnya menjadikan biang duplikat pada deskripsi.