Home » Blogger »
Tips & Trik
» Membuat Widget Pesan Pada Waktu Tertentu Spesial Ramadhan
Membuat Widget Pesan Pada Waktu Tertentu Spesial Ramadhan
Keren yah,jika blog kita dihiasi widget Pesan spesial ramadhan seperti "Sahur... Sahur" , "Selamat Berbuka Puasa" , "Selamat Menantikan Berbuka puasa" Dan masih banyak lagi.Nah kali ini saya akan membahas cara membuat widget pesan pa da waktu tertentu spesial ramadhan.Oke simak caranya berikut :
Login Akun ID/Blogger anda
Dashboard -> Tata Letak -> Add A Gadget -> HTML/Javascript
Kemudian Copy-Pastekan code berikut ini tepat di Gadget HTML tadi :
Klik untuk melihat
<script type='text/javascript'> var now = new Date(); var hours = now.getHours(); // Jam 4 Sore - 6 Sore if (hours >= 16 && hours <= 18){document.write("Selamat menantikan berbuka Puasa"); // Jam 7 Malam - 9 Malam } else if (hours >= 19 && hours <= 21){document.write("Selamat menjalankan Sholat Tarawih"); // Jam 10 Malam - 2 Dini Hari } else if (hours >= 22 || hours <= 2){document.write("Kok belum tidur? udah malam bro.."); // Jam 2 Dini Hari - 4 Dini Hari } else if (hours >= 2 && hours <= 4){document.write("Sahur! Sahur! Sahur!"); // Jam 5 Pagi - 8 Pagi } else if (hours >= 5 && hours <= 8){document.write("Selamat pagi, semoga puasanya Lancar.."); // Jam 9 Pagi - 3 Sore } else if (hours >= 9 && hours <= 15){document.write("Selamat menunaikan ibadah puasa, semoga amal ibadah kita di terima di sisi Allah SWT."); }</script>
Untuk style,Kalian bisa memodifikasikan sendiri.
Untuk yang ke-2 , ini sudah dimodifikasikan oleh Muh Akram,jika kalian berminat dengan style ini.ganti code yang diatas tadi dengan code dibawah ini :
Klik untuk melihat
<style scoped="" type="text/css">.puasa1 { color:#FFC200;}.lebaran { color:#FFC200;}.puasa { background:rgba(19, 19, 19, 0.65); font-size:130%; text-transform:uppercase; text-align:center; margin:15px 15px 0 0; padding:20px 0; font-weight:normal; border-radius:5px; line-height:1.8em; font-family:Trebuchet MS, Verdana, Arial, sans-serif;}.digit {color:#fff}.judul {color:#fff}@media screen and (max-width:974px) {.puasa { margin:10px 0 0 0;}}</style><div class='puasa'><span class="puasa1"><script type='text/javascript'> var now = new Date(); var hours = now.getHours();if (hours >= 16 && hours <= 18){document.write("Selamat menantikan berbuka Puasa"); } else if (hours >= 19 && hours <= 21){document.write("Selamat menjalankan Sholat Tarawih"); } else if (hours >= 22 || hours <= 2){document.write("Kok belum tidur sih udah malam"); } else if (hours >= 2 && hours <= 4){document.write("Sahur! Sahur! Sahur"); } else if (hours >= 5 && hours <= 8){document.write("Selamat pagi, selamat menjalankan Ibadah Puasa.."); } else if (hours >= 9 && hours <= 15){document.write("Selamat menunaikan ibadah puasa, semoga amal ibadah kita di terima di sisi Allah SWT."); }</script></span><br/><span class="lebaran"><span id="countdown"></span><script type='text/javascript'>//<![CDATA[var target_date = new Date("Jul 27, 2014").getTime(); var days, hours, minutes, seconds; var countdown = document.getElementById("countdown"); setInterval(function () { var current_date = new Date().getTime(); var seconds_left = (target_date - current_date) / 1000; days = parseInt(seconds_left / 86400); seconds_left = seconds_left % 86400; hours = parseInt(seconds_left / 3600); seconds_left = seconds_left % 3600; minutes = parseInt(seconds_left / 60); seconds = parseInt(seconds_left % 60); countdown.innerHTML = days + " <span class=\'digit\'>hari</span> " + hours + " <span class=\'digit\'>jam</span> " + minutes + " <span class=\'digit\'>menit</span> " + seconds + " <span class=\'digit\'>detik menuju</span> <span class=\'judul\'>Idul Fitri 1435H</span>"; }, 1000);//]]></script></span></div>
Code diatas dibuat oleh : Dian Anrchyta , Dan Code ke-2 oleh Muh Akram.
NOTE : JIKA BAGI KALIAN WIDGET INI MENGGANGGU,LEBIH BAIK TIDAK USAH DIPASANG
Membuat Pesan Spesial Ramadhan
Wah sebentar lagi bulan Suci Ramadhan akan tiba nih, saat memasuki bulan Ramadhan, Hari Raya Idul Fitri, Tahun Baru dan lain-lain biasa…Read More...
Cara Membuat Kotak Komentar Keren
Disqus Logo
Cara Membuat Kotak Komentar Keren-Kali ini saya akan memberi tahu untuk membuat kotak komentar yang keren di blog Dengan DISQ…Read More...
17 komentar-facebook
itu widget nya aja yg muncul2 menggangu
keren nih saya coba gan :)
Wih keren nih
nice post
Ijin Coba gan :D
Hanya saya pasang saat bulan ramadhan saya kok :) , maaf dengan ketidaknyamanannya ..
pasti :-d , coba dulu deh ^_^
waaah., boleh juga nh gan ;) izin ane coba yaa di blog ane gan.. :)
ati-ati blog jadi ngak kuat load :)
Wihh Keren nih gan :-D tapi saya takut blognya jadi risih gara" widgetnya, ane coba dulu ya gan kalo bagus ane c0baa, thanks udah share gan :-)
Izin nyoba om, thanks~
ini sebenarnya widget seperti teks gitu , ya sebaiknya tidak usah dipasang jika bagi sobat itu BERAT :-D
oke :-)
mantep banget nih gan perlu di coba mumpung masih bulan ramadhan
keren tapi bisa mengurangi kecepatan suatu blog
tenang , ada banyak cara kok untuk mengurangi loading blog.
keeren ya bisa ada jadwalnya
kaya alrm ,, langsung di coba nih
silahkan :-d