Cara Membuat Arsip Blog 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

Mohon gunakan kata-kata yang sopan dalam memberikan komentar.
Komentar SPAM, SARA, dan sejenisnya tidak akan di tampilkan.

SiLahkan TinggaLkan Komentar Anda disini...