Merubah Warna Background Dasar Blog Secara Otomatis

jika tutorial blog sebelumnya membahas cara modifikasi label-tag seperti menu navigasi ala wordpress, dan untuk tutorial blog kali ini akan membahas cara mengganti warna background dasar blog secara otomatis tanpa harus mengdit html template anda.

Cara merubah warna background dasar blog ini bisa dilakukan secara otomatis dengan menambahkan sedikit script yang bisa ditempatkan pada bagian widget blog anda.

Lihat DEMO

Cara pembuatannya seperti berikut :

Masuk pada dasbor blog anda
Pilih Rancangan >> Add widget Template >> Pilih HTML/Javascript
Masukan script merubah background outomatis dibawah ini :
<div style="overflow:auto; width:100%; height:100%;margin-top:16px">
<script type="text/javascript">
function bgChange(bg)
{
document.body.style.background=bg;
}
</script>
Pilih Warna Latar
<table border="1" width="300" height="20">
<tr> <td
onclick="bgChange('')" bgcolor="white">
</td> <td
onclick="bgChange('#FAFAD2')" bgcolor="#FAFAD2">
</td> <td
onclick="bgChange('#F0E68C')" bgcolor="#F0E68C">
</td> <td
onclick="bgChange('#E0FFFF')" bgcolor="#E0FFFF">
</td> <td
onclick="bgChange('#98FB98')" bgcolor="#98FB98">
</td> <td
onclick="bgChange('#B0E0E6')" bgcolor="#B0E0E6">
</td> <td
onclick="bgChange('#87CEFA')" bgcolor="#87CEFA">
</td> <td
onclick="bgChange('#FFDAB9')" bgcolor="#FFDAB9">
</td> <td
onclick="bgChange('#FFC0CB')" bgcolor="#FFC0CB">
</td> <td
onclick="bgChange('#E6E6FA')" bgcolor="#E6E6FA">
</td> <td
onclick="bgChange('#D3D3D3')" bgcolor="#D3D3D3">
</td> </tr>
</table>
</div>

Jika sudah silahkan Klik Simpan.
dan lihat hasilnya.

NB :: Anda bisa merubah warna-warna background yang ada di script diatas dengan mengganti kode warna sesuai selera anda. selamat mencoba.

Komentar

BLOG SANTAI mengatakan…
simple tapi keren....
Coba ahh
Belantara Indonesia mengatakan…
wow....keren tutorial ini brader...hehehhe.....hebat nyari bahannya....
Anton wijaya mengatakan…
Saya angkat topi, blog ini konsen dengan permainan warna dan desain, kapan-kapan saya akan coba mengaplikasikan tutor diatas.
Djangan Pakies mengatakan…
sejujurnya yang saya inginkan tampilan di blog saya adalah background yang tidak berwarna hitam, tapi sepeti pnya Kang Chugy ato punya Kang Adit B.I.
Ketika coba-coba ngubah HTML, mesti dengan trial dan seringkali terbentur dengan ngubah warna font. akhirnya mumet menyerah.
mudah-mudahan dengan tutor ini, akan saya coba
suwun Kang
fb mengatakan…
lucu juga ya scriptnya.. bisa dicoba.
Ferdinand mengatakan…
Dulu aku pernah nyoba make kaya gini Sob.. tapi kata yg ngunjungin malah bikin sakit mata jadi aku ilangin hhe... ini hapir sama kaya sistem bikin tulisan large atau small dengan di klik hhe.... mantabz.... aku tunggu tutor selanjutnya....

happy blogging n semangat ::
Rizky2009 mengatakan…
aq dah lihat demonya, keren bgt sob, nanti kalau sudah ada waktu akan saya coba, terima kasih dah d share
Cerita Dewasa mengatakan…
Terima kasih infonya. Sangat bermanfaat.
Save As dulu... sepertinya nanti bakalan butuh scriptnya :D
joe mengatakan…
wah ntar aja deh gan, kalau sudah bosan dengan background saya ....
genial mengatakan…
simpel nii triknya.. tinggal masukin...
blasss.. maknyus :) keren kang :)
penghuni60 mengatakan…
Oke, ane save bwt ane plajari ya...
Niesa_BloggerGirl mengatakan…
tipsnya keren uy...dapet dr mana ni. makin ok aj.
om rame mengatakan…
mantap nih. boLeh, boLeh, boLeh.
asLi keren banget deh, sekaLi kLik warna bisa kayak bungLon.
asem asem mengatakan…
Komentar ini telah dihapus oleh pengarang.
wah, boleh juga niey kodenya....Thx yaa
Global Blog's mengatakan…
Terima kasih Gan Info nya...
Mr.U mengatakan…
asli keren buangget trims yah

Postingan populer dari blog ini

Motion Tween dan Shape Tween

Motion Graphic atau Bumper

Jadikan Blogging Sebagai Sarana Ibadah Di Bulan Suci Ini + Baner Gratis