Membuat Scroll Box Di Blog

Hallo sobat blogger, pada kesempatan ini aye akan membahas mengenai cara membuat scroll box pada postingan blog.

Scroll box berguna untuk membuat halaman blog kita tidak terlalu panjang, sehingga akan terlihat lebih menarik. Juga bisa digunakan untuk memasang kode script yang akan kita terbitkan pada postingan.

Sobat.... cara untuk membuat scroll box pada postingan blog itu hanya membutuhkan beberapa langkah mudah, yaitu dengan membuat kode script seperti di bawah

<div style="overflow:auto; padding:5px; width:320px; height:80px; background-color: rgb(255, 255, 255); border:1px solid #BFBDBD;">Masukkan teks atau kode script disini atau apa saja yang akan kita pasang pada scroll box. biasanya adalah tulisan artikel yang perlu tempat lebih luas dan panjang</div>

Pasang kode script tersebut pada mode edit HTML saat menulis artikel blog.

Maka hasilnya akan terlihat seperti di bawah

Masukkan teks atau kode script disini atau apa saja yang akan kita pasang pada scroll box. biasanya adalah tulisan artikel yang perlu tempat lebih luas dan panjang

Cukup ringkas dan mudah kan... sekarang kita sudah bisa membuat scroll box pada postingan blog.
ganti tulisan yang berwarna hijau dengan yang sesuai keinginan kita, dan ganti tulisan yang berwarna merah dengan warna yang kita inginkan. itu adalah kode warna background

Oke sobat blogger sekian dulu postingan kali ini, semoga bisa bermanfaat dan sampai jumpa di postingan selanjutnya.

 
Terima kasih, atas kunjungan dengan melihat Artikel ini, di Blog Aye

Membuat Scroll Di Arsip Blog

Membuat arsip blog menjadi scroll. Trik ini sama seperti model scroll yang lain, contohnya Label Scroll 
dan Scrolling pada Box Comments. Kita hanya menambahkan script berikut: 

<div style='overflow:auto; width:ancho; height:100px;'> 
...........
</div>

Untuk letaknya apa udah pada tau? Kalo belum, ayo kita lihat caranya:

1. Login - Layout - Elemen halaman
2. Buat widget Arsip dengan nama Arsip Blog
3. Pilih model Hirearchy untuk model ini
4. Save
5. Masuk ke Edit HTML - cek kotak Expand Template Widget
6. Cari 'Arsip Blog'. Selengkapnya begini:                                                              

<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:100px;'>
<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;'>javascript:void(0)
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
</div>
<b:include name='quickedit'/>

Tambahkan Kode Warna merah ke tempatnya
7. Copas
8. Save