Cara Membuat Breadcrumbs SEO Friendly Terbaru 2015

07:26
Cara Membuat Breadcrumbs SEO Friendly Terbaru 2015 - Selamat datang kembali sobat blogger, Oke kali ini mimin akan membahas tentang breadcrumbs atau navigasi. Tentunya sudah sangat banyak tutorial yang bertebaran di google, nah kali ini mimin mau menjelaskan cara membuat breadcrumbs yang SEO friendly dan semua label terindeks oleh Search Engine.



Home>Label1>Label2>Label3>Hinggal Label akhir

Cara Membuat Breadcrumbs SEO Friendly Terbaru 2015

1. Masuk ke Blogger

  • Masuk Dashboard
  • Pilih Template
  • Klik Edit HTML
2. Salin / Copy kode CSS dibawah dan tempel / pastekan tepat diatas kode ]]></b:skin>:

/* Breadcrumbs SEO Bloggerisn */ 
.breadcrumbs{padding:0px 5px 5px 0;margin-bottom:20px;margin-top:0px;font-size:11px;color:#5B5B5B;border-bottom:1px dotted #bbb;}
3. Setelah cari kode <b:includable id='main' var='top'> lalu ganti dengan kode dibawah :

<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.Selanjutnya Simpan / Save Template Sobat

Untuk mengeceknya silahkan sobat kunjungi :

http://www.google.com/webmasters/tools/richsnippets

Untuk mencoba apakah tampil beberapa label, copy postingan Sobat yang memakan banyak label. dan klik Pratinjau. Kalau sudah berhasil, berarti breadcrumbs telah terpasang dengan baik.

http://bloggerisn.blogspot.com/2015/06/cara-membuat-breadcrumbs-seo-friendly.html

Saya adalah seorang yang sangat menyukai design dan juga dunia internet sobat bisa memanggil saya (CT), dengan blog ini semoga saya akan berbagi pengalaman saya kepada sobat semua.

Artikel Menarik Lainnya

Latest
Previous
Next Post »

Peraturan Dalam Berkomentar :
● Marilah Kita Budayakan Berkomentar Sesudah Membaca Artikel.
● Dilarang Menghina, Promosi Atau Iklan, Menyelipkan Link Aktif Dan Non Aktif
● Dilarang Berkomentar Yang Mengandung Unsur Pornografi, Spam, Sara, Politik, Profokasi.
● Budayakan Berkomentar Dengan Sopan, Bijak, dan Sesuai Artikel (Dilarang Berkomentar Diluar Topic,)
● Untuk komentar diluar topik silahkan menuju ke halaman Forum.

EmoticonEmoticon