Sabtu, 22 Desember 2012

Cara Membuat Arsip Blog dengan Scroll


 arsip dengan scroll
Gadget Arsip Blog dari blogger secara otomatis akan terus panjang ke bawah jika anda menambahkan postingan baru. Apabila Anda bosan dengan tampilan seperti itu, anda bisa memodifikasinya lewat template blog Anda. Yaitu dengan menambahkan fungsi scroll pada arsip blog. Gunanya yaitu untuk lebih menghemat space di blog dan kelihatan lebih profesional. Berikut saya jelaskan caranya:

1. Masuk ke Blogger > Tata Letak > Tambah Gadget > Arsip Blog
2. Setelah itu, pilih Template > Edit Html
3. Beri tanda centang pada tulisan Expand Widget Template
4. Tambahkan script ini <div style='overflow:auto; width:ancho; height:200px;'> tepat dibawah script <div class='widget-content'>
<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'>

v                            5. Selanjutnya tambahkan </div> disamping</div>
<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>

v                             6. Hasilnya seperti di bawah ini
<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
</div>

v                             7. Secara keseluruhan 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>

             8. Simpan Template dan lihat hasilnya

Catatan:
<div style='overflow:auto; width:ancho; height:200px;'>
200 px adalah tinggi dari scroll tersebut jadi tinggal dirubah nilainya sesuai dengan selera Anda. Gimanaaa......??  Mudah kan!!!

Tidak ada komentar:

Posting Komentar