Monday, November 19, 2012
Nah, Makhluk Astral kali ini saya akan membagikan sebuah tips untuk blog anda. Tips kali ini kita akan membuat "Navigasi Breadcrumb". Langsung saja kita lihat di TeKaPhe..
Menurut Wikipedia :
Breadcrumbs or breadcrumb trail is a navigation aid used in user interfaces. It allows users to keep track of their locations within programs or documents. The term comes from the trail of breadcrumbs left by Hansel and Gretel in the popular fairytale.
Kesimpulannya :
Navigasi Breadcrumb adalah kumpulan dari beberapa link yang memunkinkan untuk menumakan link artikel kalian atau disebut juga alamat link artikel pada blog kalian.
1. Login ke Akun Blogger.
2. Pilih Rancangan => Edit HTML =>> Centang
3. Backup template sobat terlebih dahulu, untuk berjaga-jaga jika terjadi kesalahan.
4. Cari kode ]]></b:skin> , dan letakkan kode berikut tepat diatasnya :
breadcrumbs {padding: 5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:95%; line-height:1.4em; border-bottom:3px double #e6e4e3;}
5. Cari lagi kode <b:include data='top' name='status-message'/> Paste kode di bawah ini persis di bawah kode <b:include data='top' name='status-message'/> (Jika ada 2, letakkan pada kode yang ke 2)
Source : AcerNoval's Site
<b:include data='posts' name='breadcrumb'/>
Maka akan terlihat seperti ini :
<b:include data='top' name='status-message'/><b:include data='posts' name='breadcrumb'/><data:adStart/>
7. Cari (Ctrl+F) <b:includable id='main' var='top'> lalu tambahkan script berikut tepat diatas kode tersebut :
<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 == "item"'>
<!-- breadcrumb for the post page -->
<p class='breadcrumbs'>
<span class='post-labels'>
<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'>
<b:if cond='data:label.isLast == "true"'> »
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
</b:loop>
<b:else/>
»Unlabelled
</b:if>
» <span><data:post.title/></span>
</b:loop>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb for the label archive page and search pages.. -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:blog.pageName == ""'>
<a expr:href='data:blog.homepageUrl'>Home</a> » All posts
<b:else/>
<a expr:href='data:blog.homepageUrl'>Home</a> » Posts filed under <data:blog.pageName/>
</b:if>
</span>
</p>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
