Menambah Sebuah Breadcrumb Trail ke dalam blogger Post

Hack By Hoctro's Place

Ini merupakan hack yang powerfull dari hoctro. karena hack ini sangat membantu dan memudahkan, dalam menuntun  pembaca   untuk kembali ke halaman depan blog kita atau ke dalam kategorie/label yang sama tampa perlu jauh-jauh  menjangkau tab menu atau widget/ elemen label.

Karena widget ini di simpan tepat di atas judul artikel yang di baca atau bisa juga di simpan pada bagian bawah artikel yang dibaca. dan setidaknya juga, hack ini memberi tahukan pada pembaca tentang hirarki blog dan  artikel yang di bacanya.

 

 

Bagaimana cara mengunakanya ke dalam blog kita ?

Jika anda telah lama paham cara mengedit-edit blog, saran saya lebih baik langsung pada sumber penulisnya.

 

1. Dalam  Tata-letak ( edit layout ) buka tab Edit Html. kemudian tandai/centang tulisan  Expand Template Widget.

 

 

2. Setelah itu masukan kode dari hoctro's  ini.

<b:includable id='breadcrumbs' var='post'>
<!-- Breadcrumbs hack. By Hoctro 9/11/2006 http://hoctro.blogspot.com -->
  <b:if cond='data:blog.pageType == "item"'>
      <p class='breadcrumbs'>
      <span class='post-labels'>
        <b:if cond='data:post.labels'>
          You are here:
          <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>  &gt;
          <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:if cond='data:post.title'>
&gt;  <b><data:post.title/></b>
          </b:if>
        </b:if>
      </span>
      </p>
  </b:if>
<!-- End of Breadcrums Hack -->
</b:includable>

 

di atas kode ini.

 

<b:includable id='main' var='top'>

 

3. Kemudian masukan sebaris kode dari hoctro's. ini.

 

<b:include data='post' name='breadcrumbs'/>

 

di atas kode ini.

 

<b:if cond='data:post.dateHeader'>

 

4. Setelah itu pada bagian  Css na, masukan kode ini.

 

.breadcrumbs {
border-bottom:1px dotted #000;
margin:2em 0 0.5em;
padding:0 0 0.5em;
}

 

 

Note :

Contoh ini saya mengunakan pada template " Minima ". dan posisi kode tanggal-nya belum di rubah atau di pindahkan.

Jika anda telah merubah posisi tanggalnya, saya menyimpan baris kode ini.

 

<b:include data='post' name='breadcrumbs'/>

 

di antara kode ini. ( dan berhasil )

 

<b:includable id='post' var='post'>
<div class='post hentry uncustomized-post-template'>
<b:include data='post' name='breadcrumbs'/>

 

Perhatian Juga :

Hack ini tidak akan keliatan jika artikel/ post anda belum di berikan sebuah label/categorie.

 

Technorati tags: Blogger Tutorial, Hierarchy post

 

Page views this post: reader