Cara Membuat Background Blog Berubah Sesuai Waktu

Cara Membuat Background Blog Berubah Sesuai Waktu - Memiliki tampilan blog yang keren dan menarik tentunya akan memiliki nilai tersendiri, itu sebabnya kenapa banyak sekali blog yang menyajikan tutorial seputar modifikasi tampilan blog. Saya sendiri termasuk orang yang suka sekali mengutak atik tampilan blog dengan tujuan ingin belajar lebih banyak seputar script yang ada di blogspot. Jadi mohon maaf ya kalo sobat merasa kurang nyaman karena setiap berkunjung ke sini ada saja tampilan yang berubah pada halaman blog ini.

background site

Nah bicara soal tampilan blog, kali ini saya mau berbagi cara menjadikan background blog berubah ubah sesuai waktu kunjungan. Misalkan sobat berkunjung pada pagi hari di blog ini maka background blog berwarna biru, tetapi jika sobat berkunjung lagi pada siang hari warna background blognya akan berubah menjadi orange begitu juga ketika berkunjung pada sore dan malam hari backgroundnya akan berubah dengan sendirinya menjadi warna yang lain yang sudah kita tentukan sebelumnya.

Nah jika sobat tertarik untuk menerapkannya di blog sobat. Silahkan ikuti langkahnya berikut ini.
  • Pada Dashboard Klik Tata Letak >> Add a Gadget >> HTML/Javascript.
  • Kemudian Copy paste  kode berikut ini dan untuk judul dikosongkan saja:

<script type='text/javascript'>
//<![CDATA[
 var now = new Date();
 var hours = now.getHours();
   //16-18 sore
if (hours >= 16 && hours <= 18){
document.body.style.background="#3399FF url('URL Gambar') fixed top repeat-x";
   //19-21 malam
 } else if (hours >= 19 && hours <= 21){
document.body.style.background="#99CC66 url('URL Gambar') fixed top repeat-x";
   //22-4 malam
 } else if (hours >= 22 || hours <= 4){
document.body.style.background="#993399 url('URL Gambar') fixed top repeat-x";
   //5-6 pagi
 } else if (hours >= 5 && hours <= 7){
document.body.style.background="#CC99CC url('URL Gambar') fixed top repeat-x";
   //7-8 pagi
 } else if (hours >= 7 && hours <= 8){
document.body.style.background="#9966CC url('URL Gambar') fixed top repeat-x";
   //9-15 siang
 } else if (hours >= 9 && hours <= 15){
document.body.style.background="#868579 url('URL Gambar') fixed top repeat-x";
 }
//]]>
</script>
Keterangan :
  • Kode yang bergaris bawah adalah kode warna background, silahkan ganti dengan warna yang di inginkan atau sobat bisa juga menuliskannya dengan nama warna  seperti red, green, blue dan lain lain.
    Klik disini untuk Kode Warna HTML
  • Untuk URL Gambar silahkan ganti dengan Gambar jika sobat ingin menggunakan gambar sebagai background'nya jika tidak hapus saja kode tersebut.
  • Untuk yang lainnya silakan bereksperimen sendiri sesuai selera sobat.
Demikian Cara Membuat Background Blog Berubah Sesuai Waktu semoga bermanfaat.

2 Responses to "Cara Membuat Background Blog Berubah Sesuai Waktu"

  1. cara ganti tiap waktunya gimana bang ..?

    ReplyDelete
  2. cara ngubah waktunya gmana kak?

    ReplyDelete

Komentar yang menyertakan iklan, atau titip link, akan dimasukan ke Folder SPAM.

Untuk pertanyaan di luar Topik Artikel silahkan kik OOT (apabila dipertanyakan di sini, mohon maaf apabila tidak dibalas).