Simpan » Diposting oleh Unknown » Minggu, 24 Juni 2012 »
permalink

Minggu, 24 Juni 2012
Unknown
No comments

Cara Mudah Membuat Categories Roll

 
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 warna merah di atas.


Reaksi:

0 komentar:

Ayo komentar kamu yang pertamax wa di Cara Mudah Membuat Categories Roll

 
powered by blogger.com and maxwidth simple build 0.02 mobile template