Cara Membuat Widget Hitungan Mundur Puasa Bulan Ramadhan 2016

Cara Membuat Widget Countdown Puasa Bulan Ramadhan 2016 - Selamat datang sobat blogger, kembali lagi saat ini saya akan berbagi artikel mengenai blog serta Ramadhan. Mungkin sudah pernah dengar dengan widget yang satu ini pada tahun lalu, namun untuk tahun ini masih jarang orang yang memasang. Inilah Cara Memasang Widget Countdown atau Hitungan Mundur untuk menyambut ulan Ramadhan 2016. Untuk Previewnya silahkan dilihat pada header blog ini.

Cara Pasang Widget Hitungan Mundur Bulan Ramadhan 2016 di Blog

1. Buka Blogger, dan pilih blog mana yang akan dipasangi.
2. Masuk ke menu "Tata letak" lalu tambahkan widget pilih "HTML/Javascript" kemudian masukan       kode berikut :

    <style type="text/css" scoped="scoped">
#bulanramadhan2016 {background:black;color:#0EDC00;font-family:Oswald, Arial, Sans-serif;font-size:20px;text-transform:uppercase;text-align:center;padding:10px 0;font-weight:normal;}
  .teks {color:white}
</style>
<div id="bulanramadhan2016">
<span id="countdown"></span>
</div>
<script type='text/javascript'>
//<![CDATA[
// set the date we're counting down to
var target_date = new Date("Jun 8, 2016").getTime();
// variables for time units
var days, hours, minutes, seconds;
// get tag element
var countdown = document.getElementById("countdown");
// update the tag with id "countdown" every 1 second
setInterval(function () {
    // find the amount of "seconds" between now and target
    var current_date = new Date().getTime();
    var seconds_left = (target_date - current_date) / 1000;
    // do some time calculations
    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);
    // format countdown string + set tag value
  countdown.innerHTML = days + " <span class=\'teks\'>hari</span> " + hours + " <span class=\'teks\'>jam</span> "
  + minutes + " <span class=\'teks\'>menit</span> " + seconds + " <span class=\'teks\'>detik menuju bulan ramadhan </span> 2016";
}, 1000);
//]]>
</script>

3. Paste lalu simpan dan lihat perubahanya.

Keterangan :
Ubah yang saya beri warna merah sesuai dengan warna selera anda untuk mengganti warna pada tulisan waktu.
Ubah warna hijau sesuai ukuran yang diinginkan untuk mengubah ukuran tulisan.

Nah itulah cara memasang Widget Countdown atau Hitungan Mundur untuk Menyambut Bulan Puasa Ramadhan 2016. Sekian dulu dari saya. Terimakasih.

Berbagi :