Pasang Tombol Ganti Background Blog

8/03/2011 Blog Tutorial Blogger Tips dan Trik Tips Trik Blog Widget
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

Artikel Terkait

Previous
Next Post »
Penulisan markup di komentar
  • Untuk menulis huruf bold silahkan gunakan <strong></strong> atau <b></b>.
  • Untuk menulis huruf italic silahkan gunakan <em></em> atau <i></i>.
  • Untuk menulis huruf underline silahkan gunakan <u></u>.
  • Untuk menulis huruf strikethrought silahkan gunakan <strike></strike>.
  • Untuk menulis kode HTML silahkan gunakan <code></code> atau <pre></pre> atau <pre><code></code></pre>, dan silahkan parse dulu kodenya pada kotak parser di bawah ini.

Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

11 comments

Makasi banyak Akang ...

Kalo Tiap kali mau liat blog aku yah akang

pasti aku liat blog akang dul

hahaii . . . . ~~ :D

Balas

@Michael Ebeng Putra (D'cakiel) Masa Sob mungkin ada kekeliruan, Mohon Coba lagi mudah-mudahan kali ini berhasil, sudah saya Update SOB

Balas

akang bloleh nanya ga' ??

gimana sih caranya buat

yang di atas n'tuh





home , Tips blog , kode warna , trik facebook , template , dan lain2

kasih tau yah akang :D

Balas

mksih ms....blog ni sngat b'manfaat n aku bnyak b'ajar dsni....kmsih2!

Balas

lama ngak maen2 ke tempatku...mohon bantuan...seri udah coba teknik "Menampilkan Next Page Hanya Judul" tapi hasilnya ngak sama seperti di blog kang rohman...

mohon di buat satu tutorial terperinci sob.

Balas

Thanks sebelumnya untuk kang fatur dan tetap semangat selalu...okh, saya mau tanya untuk kotak space iklan gimana ya..kang!!bisa bantu gak??
Salam PERSAHABATAN dan suksesok

Balas

hadeuh kan mantap banget kang turial nya

Balas