Breaking News
Loading...
Thursday 13 June 2013

Info Post
Pada kesempatan kali ini saya akan memberikan trik tentang Cara Membuat Breadcrumb Navigation sebagai Pengganti Label.

Cara Membuat Breadcrumb Navigation sebagai Pengganti Label pada Blogspot :

  • Login pada Blogger
  • Masuk mode Rancangan, kemudian Edit HTML
  • Centang Expand Widget Templates
  • Klik Download Template Lengkap untuk mengbackup.
  • Cari kode ]]></b:skin>
  • Letakan kode berikut sebelum kode tadi
.breadcrumbs { padding:5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:95%; line-height: 1.4em; border-bottom:3px double #e6e4e3;
  • Selanjutnya cari kode
<b:include data='top' name='status-message'/>
  • Ganti kode tadi dengan kode berikut
<b:include data='top' name='status-message'/>
<b:include data='posts' name='breadcrumb'/>
  • Selanjutnya cari lagi kode
<b:includable id='main' var='top'>
  • Ganti kode tadi dengan kode Optimized HTML berikut

<b:includable id='breadcrumb' var='posts'> <b:if cond='data:blog.homepageUrl == data:blog.url'> <!-- No breadcrumb on home page--> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <p class='breadcrumbs'> <span class='post-labels'>Results found at &gt; <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> <b:loop values='data:posts' var='post'> <b:if cond='data:post.labels'> <b:loop values='data:post.labels' var='label'>&gt; <a expr:href='data:label.url' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast == &quot;true&quot;'>&gt; </b:if> </b:loop> <b:else/> &gt; </b:if> <span><data:post.title/></span> </b:loop> </span> </p> <b:else/> <b:if cond='data:blog.pageType == &quot;archive&quot;'> <!-- breadcrumb for the label archive and search pages - blogspot seo friendly breadcrumbs by http://www.uc1n.com--> --><p class='breadcrumbs'> <span class='post-labels'> <a expr:href='data:blog.homepageUrl'>Home</a> &gt; Archives for <data:blog.pageName/> </span> </p> <b:else/> <b:if cond='data:blog.pageType == &quot;index&quot;'> <p class='breadcrumbs'> <span class='post-labels'> <b:if cond='data:blog.pageName == &quot;&quot;'> <a expr:href='data:blog.homepageUrl'>Home</a> &gt; All posts <b:else/> <a expr:href='data:blog.homepageUrl'>Home</a> Posts filed under &gt;<data:blog.pageName/> </b:if> </span> </p> </b:if> </b:if> </b:if> </b:if> </b:includable> <b:includable id='main' var='top'>
  • Jika sudah, Simpan
Tambahan :
Jika ingin judul posting di akhiri breadcrumb Anda memuat link seperti di blog ini, silahkan ganti kode
<span><data:post.title/></span>

Dengan kode berikut
<b:if cond='data:post.url'> <a expr:href='data:post.url'><span><data:post.title/></span></a></b:if>

Silahkan Simpan Template dan selesai
Demikian blogger tutorial mengenai Cara Membuat Breadcrumb Navigation sebagai Pengganti Label. 

Semoga bermanfaat dan semoga berhasil. 
Terima Kasih ^_^

0 komentar:

Post a Comment