Jumat, 11 Februari 2011

Memasang Label Kategori dengan Scroll

Cara memasang Label Kategori dengan model scroll dapat memberikan penghematan terhadap sidebar blog yang kita miliki, karena disamping meringkas isinya yang terlalu panjang menjadi telihat bersusun dengan scroll juga dapat mempercantik tampilan blog yang kita miliki. 
Teknik dalam memasang Label dengan gaya scroll yaitu:
1. Tentunya sobat harus masuk kedalam Account Blogger sobat terlebih dahulu
2. Sobat Tab pada Design atau Tata Letak 
3. Sobat Pilih Tab Edit HTML
4. Centang Expand Widget Templates
5. Sobat harus mengetahui nama Title Label Kategori yang sobat buat, contoh tech id menggunakan Title "Blog Categori" Maka yang akan dicari pada code hmtl tersebut adalah "Blog Categori"
6. Untuk mempermudah pencarian "Blog Catehori" sobat gunakan ctrl+f dan ketikkan pada kotak Find "Blog Categori"
7. Setelah ketemu, copy kan script code berikut :
<div style='overflow:auto; width:ancho; height:250px;'>

Tepat dibawah code :

<div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>

dan code penutup dari code

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

yaitu script code : 

</div>

dan Pastekan tepat diatas code 

</b:includable>

Sehingga menjadi seperti:

<b:widget id='Label1' locked='false' title='Blog Categori' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
<div style='overflow:auto; width:ancho; height:250px;'>
<b:if cond='data:display == &quot;list&quot;'>
<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>
<b:if cond='data:showFreqNumbers'>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
</ul>
<b:else/>
<b:loop values='data:labels' var='label'>
<span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
<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>
<b:if cond='data:showFreqNumbers'>
<span class='label-count' dir='ltr'>(<data:label.count/>)</span>
</b:if>
</span>
</b:loop>
</b:if>
<b:include name='quickedit'/>
</div>
</div>
</b:includable>
</b:widget>


Pada code <div style='overflow:auto; width:ancho; height:250px;'> anda dapat mengatur ketinggian / panjang scroll yang ditampilkan, yaitu dengan menambahkan atau mengurangi angka 250 yang di blog merah sesuai dengan keinginan sobat. 

8. Save templates sobat, dan perhatikan hasilnya.
Previous Post
Next Post

post written by:

0 comments: