Senin, 27 September 2010

Arsip Blog Model Scroll

Tampilan arsip blog standard Blogger biasanya tidak menggunakan fungsi scroll. Sehingga apabila jumlah arsip/posting sudah cukup banyak, akan memanjang ke bawah. Itu terlihat sangat menghabiskan tempat. Untuk terlihat lebih irit/minimalis dalam penempatan arsip blog.Kita tinggal menambahkan script berikut:

<div style='overflow:auto; width:ancho; height:200px;'> dan </div>

Berikut cara menambahkannya:
- Login ke blog
- Masuk ke menu Rancangan, klik Edit HTML
- Centang "Expand Widget Template"
- Supaya aman, silakan Download dulu template (klik Download Template Lengkap)
- Gunakan tombol F3, (Di toolbar bawah browser akan muncul kotak pencarian, kita tinggal masukkan kode yang dicari)
Cari kode yang mirip di bawah ini :

<b:widget id='BlogArchive2' locked='false' title='Arsip Blog' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
<b:if cond='data:style == &quot;HIERARCHY&quot;'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == &quot;FLAT&quot;'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
<b:include name='quickedit'/>

Kalau sudah ketemu sisipkan/tambahkan script yang berwarna merah di atas tadi. Hasilnya akan seperti ini:

<b:widget id='BlogArchive2' locked='false' title='Arsip Blog' type='BlogArchive'>
<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:200px;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
<b:if cond='data:style == &quot;HIERARCHY&quot;'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == &quot;FLAT&quot;'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div></div>
<b:include name='quickedit'/>

Keterangan: tulisan/angka yang berwarna biru (200), itu adalah ukuran ketinggian scroll. Kita bisa menggantinya sesuai keinginan.

Sekian dulu, selamat mencoba.

Tidak ada komentar:

Posting Komentar