Cara Membuat Breadcrum V2


Cara Membuat Breadcrum V2 - Mau mempunyai breadcrum sepeterti saya ?Membuat menu Breadcrumb versi terbaru - Menu breadcrumb sangatlah penting untuk meningkatkan SEO blog. Breadcrumb biasanya muncul horizontal di atas judul suatu posting, tepatnya biasanya di bawah bar judul atau header. Beradcrumb memberikan jejak bagi pengguna untuk mengikuti kembali ke titik awal atau entri.

Breadcrum membuat blog menjadi SEO friendly karena index search engine mudah dalam meng-crawl-ling isi dari blog/website. Jadi tidak rugi untuk membuat Breadcrumb, lihat saja blog yang sudah memiliki Page rank, mera semua menggunakan Breadcrum.

Sekarang bagaimana cara membuatnya?
 Saya akan membagi tutorial ini yang di gunakan oleh Kucoba.com. Dan juga ini termasuk yang saya gunakan. Lanngsung mari praktekkan.

 1. Buka blogger,

 2. Masuk rancangan, pilih sub menu Edit HTML, Centang Kotak Expend Widget

 3. Sekarang anda carilah code <div class='post hentry'>

 4. Copy code di bawah ini, dan paste tepat di bawah code <div class='post hentry'>

 <b:if cond='data:blog.pageType == &quot;item&quot;'>
 <div class='breadcrumbs'>
 <span class='Apple-style-span' style='font-family: Verdana, sans-serif;'>Your Are Here</span><img src='http://3.bp.blogspot.com/-NmetlNGsaKg/TaTj8FG7UBI/AAAAAAAABQs/hcVC_KgGwH0/s1600/kangsalman+crumb.gif'/> <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
 &#187;
 <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;'>,</b:if>
 </b:loop>
 &#187;
 </b:if>
 <data:post.title/>
 </div>
 </b:if>
 <b:if cond='data:blog.pageType == &quot;archive&quot;'>
 <div class='breadcrumbs'>
 <span class='Apple-style-span' style='font-family: Verdana, sans-serif;'>Browse</span><img src='http://3.bp.blogspot.com/-NmetlNGsaKg/TaTj8FG7UBI/AAAAAAAABQs/hcVC_KgGwH0/s1600/kangsalman+crumb.gif'/> <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
 &#187; Archives for <data:blog.pageName/>
 </div>
 </b:if>

 5. Setelah itu untuk membuat kota border agar telihat rapi Breadcrumbnya, Masukkan code di bawah ini sebelum kode ]]></b:skin>

 .breadcrumbs {
 padding:8px 0px 10px 5px;
 margin: 0px 0px 5px 0px;
 font-size:88%;
 border:1px double
 #e6e4e3;
 }

 Simpan dan lihat hasilnya.

 Untuk Breadcrum ini, tidak akan pernah eror walupun menggunakan label yang banyak. Soalnya Breadcrumb yang sebelum-sebelumnya apabila label banyak maka Breadcrumb akan eror. Semoga artikel ini bermanfaat bagi anda.

0 komentar:

Posting Komentar