Thursday 12 September 2013

Cara membuat Breadcrumbs di Blogspot

Cara membuat Breadcrumbs di Blogspot - Artikel kali ini akan membahas tentang fitur navigasi yang terletak di atas atau bisa juga di bawah judul postingan, yang biasa kita kenal dengan nama breadchumb. Pengertian breadcrumb sendiri kurang lebihnya adalah suatu navigasi yang berisikan kategori atau label dari postingan dan bisanya selalu di awali dengan tombol menuju home (halaman depan blog).

Pada dasarnya Breadcrumb merupakan navigasi seo sebaris dengan tautan internal yang memungkinkan pengunjung untuk menavigasi balik ke bagian sebelumnya atau ke halaman depan dengan cepat.
Seperti biasa, lakukan dulu lah download Template, Cadangkan/Pulihkan > Unduh Template Lengkap. Ini tidak lain untuk antisipasi. Tapi, saya sudah berulang kali mencoba tutorial ini. Semoga Anda juga berhasil.
  • Login di Blogger
  • Pilih Template 
  • Pilih Edit HTML (lebih baik back up template dulu untuk menghindari kesalahan) 
  • Centang Expand Widget Templates 
  • Kalau sebelumnya anda sudah memasang breadcrumbs silahkan dihapus dulu kode breadcrumb yang lama 
  • Kemudian cari kode ]]></b:skin> 
  • Copy kode di bawah ini dan paste tepat di atas kode ]]></b:skin>
.breadcrumbs {padding:5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:85%; line-height: 1.4em; border-bottom:3px double #e6e4e3;}
  • Kemudian cari kode <b:includable id='main' var='top'> gunakanlah CTRL+F untuk mempermudah pencarian 
  • Ganti kode <b:includable id='main' var='top'> dengan kode yang dibawah ini :
<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'/>
  • Dan langkah terakhir adalah Simpan Template 

Demikianlah tadi postingan kali ini tentang Cara membuat Breadcrumbs di Blogspot dan semoga bermanfaat. Terimakasih.
thumbnail
Judul: Cara membuat Breadcrumbs di Blogspot
Rating: 100% based on 99998 ratings. 5 user reviews.
Ditulis Oleh

Artikel Terkait SEO, Tutorial Blog :

0 comments:

Post a Comment

 
Copyright © 2013. About - Sitemap - Contact - Privacy
Template Seo Ali oleh Ali Madura - Published by Gratis Template Blog