Membuat Kotak Scroll

Posting kali ini kita akan membuat kotak Scrool. Kotak Scroll adalah kotak yang dapat memuat berbagai isi seperti gambar, teks ataupun link yang dapat kita tarik (scroll) ke atas-bawah. Kotak scroll banyak dimanfaatkan oleh para blogger untuk menghemat ruangan pada blognya juga agar tampilannya unik dan menarik.

Contoh kotak scrool

• Isi 1
• Isi 2
• Isi 3
• Isi 4

Tertarik? Ikuti langkah-langkahnya dibawah ini.

1. Copy kode HTML berikut

<div style="overflow:auto; background-color: #ADFF2F; width:100%px; height:200px; padding:5px; border:1px solid #999999; ">

<ul>
<li><a href="http://linkanda.blogspot.com">Judul</a></li>
<li><a href="http://linkanda.blogspot.com">Judul</a></li>
<li><a href="http://linkanda.blogspot.com">Judul</a></li>
<li><a href="http://linkanda.blogspot.com">Judul</a></li>
<li><a href="http://linkanda.blogspot.com">Judul</a></li> 
</ul>

</div>

Keterangan :
* background-color: #ADFF2F; > Silahkan ganti dengan warna background yang sobat inginkan. Klik disini untuk melihat kode warna HTML
* width:100%px; dan height:200px; Ubah lebar dan tinggi kotak scroll agar sesuai dengan lebar dan tinggi halaman blog sobat.
* http://linkanda.blogspot.com : Ganti dengan link sobat.(sobat juga bisa memasukkan teks atau gambar).
* Judul : Ketik Judul yang sobat inginkan. 

2. Login ke blogger
3. Klik Rancangan > Elemen Laman > Tambah Gadget > pilih HTML/JavaScript. 
4. Kemudian Paste kode HTML yang sudah di copy tadi ke kotak konten
5. Klik Simpan dan lihat hasilnya

Semoga bermanfaat....

Related Post