Cara Membuat Breadcrumb Navigation sebagai Pengganti Label

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 ^_^

Read More