Thursday, July 15, 2010

Cara Membuat Breadcrumb-navigation pada Blogspot

Kurang lebih contoh dari Breadcrumb-navigation pada Blogspot, adalah seperti gambar dibawah ini. adapun cara membuatnya adalah :
 
  1. Login ke blogger.com
  2. Klik Tata Letak.
  3. Pilih tab Edit HTML
  4. Click Download Full Template and please back up your template first.
  5. Kemudian beri tanda centang pada kotak kecil di samping tulisan Expand Template Widget.
  6. Silahkan cari kode ]]></b:skin>
  7. Copy lalu paste kode di bawah ini persis di atas kode ]]></b:skin>
.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:95%;
line-height: 1.4em;
border-bottom:3px double
#e6e4e3;
}


8. Cari lagi kode <div class='post hentry uncustomized-post-template'> jika tidak ada, coba cari kode <div class='post hentry'>

9. Sisipkan kode berikut di bawah kode tadi

<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>

Browse &#187; <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 == &quot;true&quot;'> &#187;
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
&#187; <span><data:post.title/></span>
</b:loop>
</b:if>
</b:loop>

</div>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<div class='breadcrumbs'>
Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; Archives for <data:blog.pageName/>
</div>
</b:if>
<b:else/>
<b:if cond='data:navMessage'>
<div class='breadcrumbs'>
<data:navMessage/>
</div>
</b:if>
</b:if>

7. Save templates...

0 comments:

Post a Comment

ShareThis

 

Subscribe via email

Enter your email address:

Delivered by FeedBurner


Blog Archive


let's learn to share Copyright © 2010 Check Google Page Rank