Download this Blogger Template by Clicking Here!

Membuat Background Blog Berubah-ubah Warna


Pernahkah anda mendapat keluhan dari pembaca  dengan teriakan seperti di bawah ini?..

"Hoi, pemadaman lampu ya, kok gelap banget disini?.

Atau mungkin seperti ini..

"Blognya mengkilat banget Mas, bisa-bisa saya kena trachom membacanya"
 
Sebenarnya semua itu bisa menjadi sebuah dilema bagi anda. Disatu sisi anda mungkin sudah merasa sreg dengan tampilan blog anda. Namun disisi lain anda pun dituntut bisa memberikan sebuah kenyamanan pagi para pengunjung di blog anda. Nah berikut ini ada sebuah cara untuk sedikit ngakali bagaimana agar tampilan blog anda bisa diubah-ubah warnanya menurut selera.

Ada dua cara yang bisa anda lakukan. Yang pertama anda bisa pasang sebuah widget di sidebar yang berisi sekumpulan warna. Dimana saat warna di dalam widget tersebut diklik, akan merubah warna background anda secara otomatis. (untuk contoh widget, bisa anda lihat di sidebar pojok kiri atas blog ini).

Cara yang kedua sebenarnya hampir sama dengan cara yang di atas. Cuma kali ini bukanlah widget warna yang nantinya akan dipasang di sidebar. Tapi akan membuat sebuah efek warna background berubah secara otomatis saat direfresh. (untuk contohnya coba anda refresh blog ini)

Klik Rancangan - Tambah Gaddget -  pilih HTML/Javascript.  Lalu masukkan script di bawah ini.

Cara 1.

<center>
<script type="text/javascript">
 function bgChange(bg)
 {
 document.body.style.background=bg;
 }
 </script>
 <table border="1" height="30" style="width: 120px;">
 <tr>
 <td onclick="bgChange('#000000')" bgcolor="#000000"></td>
 <td onclick="bgChange('#FFD700')" bgcolor="#FFD700"></td>
 <td onclick="bgChange('#FF00FF')" bgcolor="#FF00FF"></td>
 <td onclick="bgChange('#DCDCDC')" bgcolor="#DCDCDC"></td>
 <td onclick="bgChange('#00BFFF')" bgcolor="#00BFFF"></td></tr>
<tr>
 <td onclick="bgChange('#008000')" bgcolor="#008000"></td>
 <td onclick="bgChange('#CD853F')" bgcolor="#CD853F"></td>
 <td onclick="bgChange('#DDA0DD')" bgcolor="#DDA0DD"></td>
 <td onclick="bgChange('#FFFFFF')" bgcolor="#FFFFFF"></td>
<td onclick="bgChange('#FFFF00')" bgcolor="#FFFF00"></td>
 </tr>
 </table>
</center> 

warna merah : sesuaikan dengan ukuran sidebar anda
warna biru : ganti warna menurut selera anda

Contoh : coba klik salah satu warna di kotak


Cara 2.

<script type='text/javascript'>
//CDATA[
var bgcolorlist=new Array("#7FFFD4", "#BDB76B", "#00BFFF", "#DCDCDC", "#FFD700", "#FFFF00", "#008000", "#FFFFFF")
document.body.style.background=bgcolorlist
[Math.floor(Math.random()*bgcolorlist.length)]
//]]>
</script>
 

warna biru : ganti warna menurut selera anda (kode warna bisa dilihat DISINI)

lalu SIMPAN dan lihat hasilnya.

contoh : coba refresh tampilan blog ini

Bagaimana mudah kan?. Yo wis selamat bermain warna di blog anda. Oh ya tidak semua template bisa dipasang script ini. Jadi jika saja anda mencoba pasang dan tak berefek apa-apa, Jangan kaget ya hahaha.