Cara Membuat Count Down Timer Idul Fitri 2015 Di Blog

21:15:00
Cara Membuat Count Down Timer Idul Fitri 2015 Di Blog


Selamat datang agan atau aganwati kali ini saya akan berbagi tips blogging yaitu cara membuat count down timer idul fitri 2015 di blog, count down timer merupakan widget untuk menghitung mundur waktu yang akan ditempuh untuk masuk ke dalam hari raya idul fitri. Nah untuk penampakan dan penerapannya silakan ikuti di bawah ini;


Cara Membuat Count Down Timer Idul Fitri 2015 Di Blog


Langkah

1. Login pada blog anda masing-masing,

2. Pada menu dashboard blog, pilih menu tata letak,

3. Lalu pilih tambahkan gadget,

4. Pilih menu HTML / Javascript,

5. Copy script di bawah ini,

 <div id='lebaran'>
<span id='countdown'>
</span></div>
<script type='text/javascript'> 
//<![CDATA[ 
var target_date = new Date("Jul 17, 2015").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 class=\'juduls'>Idul Fitri 1436 H</span>";
}, 1000);
//]]>
</script> 


6. Paste pada kolom HTML / Javascript tadi,

Cara Membuat Count Down Timer Idul Fitri 2015 Di Blog


7. Simpan,

8. Kembali ke menu dashboard, pilih menu template, lalu pilih menu edit html,

9. Setelah itu cari kode </b:skin> dengan cara
Ctrl
+
F
,

10. Copy script di bawah ini,

 #lebaran {
  background:none repeat scroll 0% 0% rgba(19,19,19,0.65);
  color:#FFC200;
  font-size:130%;
  text-transform:capitalize;
  text-align:center;
  padding:15px 0;
  font-weight:normal;
  border-radius:5px;
  line-height:1.8em;
  font-family:&
  quot;
  Roboto&
  quot;
  ,Arial;
  margin-bottom:15px;
}

.digit {
  color:white;
}

.juduls {
  color:#FFC200;
} 


11. Paste script tersebut tepat di atas kode </b:skin>,

12. Simpan template.





Nah itu saja dari saya semoga bermanfaat jangan lupa bagikan serta tinggalkan komentar anda, terima kasih.

Share this

I'm CEO & Founder in http://caritema.com & http://renaldyways.blogspot.com/


Artikel Menarik Lainnya

Next Article
Next Post
Previous Article
Previous Post
Cara style text di komentar Disqus dan Blogger:
  • 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.
  • Untuk menggunakan emoji di bawah ini cukup copy kode tersebut dan beri jarak 1 spasi untuk menampilkan emoji pada kolom komentar Blogger.
Parser Kode
FAQ
Emotikon

Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger
Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

4 Comments

Brian Razpect 25 June 2015 at 12:40

ijin pakai gan

M Ali Maliki 25 June 2015 at 20:37

Makasih kang , idzin tempel di blog ;)

Renaldy Ramadani 30 June 2015 at 09:00

yoi gan monggo :2thumbup

Renaldy Ramadani 30 June 2015 at 09:22

yoi gan, sama2 :samasama