Pasang Tombol Ganti Background Blog

Published by Kang Fathur Wednesday, August 03, 2011

Assalamu'alaikum salam Blogger, sebelumnya Saya ucapkan selamat Berpuasa, setelah lama Saya gak posting di blog untuk kesempatan ini saya meluangkan waktu untuk membuat postingan khususnya untuk para sobat Kang Fatur semua, ya sambil ngabuburit dibulan Ramadhan mudah-mudahan postingan ini menjadi sebuah Amal bagi Kang Fatur dan dapat bermanfaat bagi pa ra sobat semua.

Postingan kali ini Kang Fatur mao mengetengahkan tutorial sederhana yaitu tentang "Pasang Tombol Ganti Background Blog". dengan adanya tombol ini Blog kita bisa di ganti-ganti dengan bermacam-macam efek Background Warna sesuai kesukaan kita.

Untuk DEMO silahkan klik salah satu warna di bawah ini dan lihat perubahannya :

OK, Kang Fatur tidak akan banyak-banyak berbicara lagi kita langsung aja ke tahap pembuatan Tombol Ganti Background Blog :

1. Seperti biasa LogIn ke Blogger sobat
   
2. Pada halaman Dasbor klik Rancangan
   
3. Pada Halaman Elemen Laman klik Tambah Gadget / add a gadget, pilih yang HTML/Javascript
   
4. Kemudian Copy dan Paste Kode di bawah ini di ktak HTML/Javascript
   
   
   

   <center><script type="text/javascript">
   function bgChange(bg)
   {
   document.body.style.background=bg;
   }
   </script>
   
   <table border="1" width="660" height="20">
   <tr> <td
   onclick="bgChange('#FFFFFF')" bgcolor="white">
   <td
   onclick="bgChange('#000000')" bgcolor="#000000">
   <td
   onclick="bgChange('#F0E68C')" bgcolor="#F0E68C">
   
   <td
   onclick="bgChange('#E0FFFF')" bgcolor="#E0FFFF">
   <td
   onclick="bgChange('#98FB98')" bgcolor="#98FB98">
   <td
   onclick="bgChange('#B0E0E6')" bgcolor="#B0E0E6">
   <td
   onclick="bgChange('#87CEFA')" bgcolor="#87CEFA">
   <td
   onclick="bgChange('#FFDAB9')" bgcolor="#FFDAB9">
   <td
   onclick="bgChange('#FFC0CB')" bgcolor="#FFC0CB">
   
   <td
   onclick="bgChange('#E6E6FA')" bgcolor="#E6E6FA">
   <td
   onclick="bgChange('#D3D3D3')" bgcolor="#D3D3D3">
   
   </td
   ></td
   ></td
   ></td
   ></td
   ></td
   ></td
   ></td
   ></td
   ></td
   ></td
   ></tr>
   </table>
   
   <div class='clear'></div></center>

   
   
   
5. Kemudian Klik tombol Simpan/Save

PERHATIAN

• Untuk kode yang berwarna Biru silahkan sobat ganti dengan nama warna yang di pasang oleh sobat. dan
  
• Untuk kode yang berwarna Merah silahkan sobat ganti dengan kode warna yang sobat inginkan, untuk kode warna silahkan klik disini ata disini

Selamat mencoba, dan semoga bermanfaat. Untuk tombol Ganti Background dengan Gambar akan menyusul.


KOMENTAR ANDA SANGAT BERMANFAAT BAGI PERKEMBANGAN BLOG INI