Cara memberi scroll pada label ~ Free Download Gratis Software ~ dll..

Senin, 19 Desember 2011

Cara memberi scroll pada label



Label yang panjang tentu saja akan sedikit mengganggu penampilan blog sobat karena panjang sidebar menjadi tidak menentu. Untuk itulah perlu dibuatkan scroll agar panjangnya tetap sesuai aturan yang kita buat. Cara ini tak jauh berbeda dengan cara memberi scroll pada blog archive  dan cara memberi scroll pada popular post yakni dengan memasukkan kode style='overflow:auto; height:200px' nah mungkin masih pada bingungkan??? langsung ada deh ke tutorialnya : 1. Login Blog 2. Rancangan --> Edit HTML --> jangan lupa Centang Expand Template Widget 3. Cari kode dibawah ini ( NB: Harus ada widget labelnya terlebih dahulu ) 4. Tekan Ctrl + F untuk memudahkan mencari 5. Cari kode seperti dibawah ini dan 6. Masukkan kode yang berwarna merah seperti dibawah ini :


<b:widget id='Label1' locked='false' title='Label' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>



<div style='overflow:auto; width:ancho; height:300px;'>


 <ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'>
<data:label.name/>
</span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
<data:label.name/>
</a>
</b:if>
<span dir='ltr'>(<data:label.count/>)</span>
</li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div> </div> </div>
kalau sudah ketemu tinggal tambahkan saja kode yang warna merah itu untuk fungsi scrollnya.
Angka 300px adalah tinggi kotak scroll. bisa sobat ganti sesuai selera sobat...


kode <div class='widget-content'> ttidak ketemu????? 
Tenang gak usah khawatir, mungkin pada template sobat yang ada hanya kode berikut..


<div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
caranya kalau adanya kode di atas ini maka taruh <div style='overflow:auto; width:ancho; height:300px;'> dibawah kode yang berwarna hijau.. 


Selamat mencoba...

Related Post



0 komentar:

Posting Komentar

/** -------------------------------------------- **/
Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Powerade Coupons