Laman

Minggu, 22 Mei 2011

Cara Mudah Membuat Categories Roll

Share Cukup menghabiskan banyak space di sidebar tentunya jika jumlah kategori/label dalam post terlalu banyak.
Sebagai solusinya maka kita edit/ubah label kategori tersebut menjadi Categories roll. Maksudnya supaya kategori/label dapat diroll atau digeser naik turun, sehingga tidak memakan space yang seharusnya bisa dimanfaatkan untuk widget lain. Seperti yang diterapkan pada blog ini.

Berikut caranya :
  1. Pastikan Anda sudah menambahkan widget Label
  2. Untuk memudahkan proses pengubahan, ubah nama widget label tersebut menjadi "Categories" dan jangan lupa simpan
  3. Kemudian masuk di Layout --> Edit HTML pada template blog anda.
  4. Jangan lupa klik "Expand Widget Templates"
  5. Kemudian cari atau CTRL+F dan ketikan categories (sesuai step no.2), Akan tampil :
<b:widget id='Label1' locked='false' title='Categories' type='Label'>
<b:includable id='main'>

  • Tambahkan kode berikut dibawah kode tadi :
<div style='width:100%; height:150px; overflow:auto;'>
<font size='2'>

  • Kemudian sebagai penutup kode, sesuai dengan tag div dan font (untuk memudahkan proses close tag saya) maka Anda tambahkan kode dibawah ini, di atas kode </b:includable>, tepatnya antara </b:includable> dan </div> :
</font>
</div>


Source lengkapnya Seperti ini :
<b:section class='sidebar-left' id='sidebar-left' preferred='yes'>
<b:widget id='Label1' locked='false' title='Categories' type='Label'>
<b:includable id='main'>

<div style='width:100%; height:150px; overflow:auto;'>
<font size='2'>

<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url + &quot;?max-results=50&quot;'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url + &quot;?max-results=50&quot;'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>

</div>
</font>
</div>
</b:includable>

Anda bisa mengubah tinggi rendahnya dengan mengubah nilai pada kode yang tersorot biru di atas.

0 komentar:

Posting Komentar