Cara Memasang Widget Jam dan Tanggal di Blog Dengan JavaScript

 | Kalu biasanya sih pasang jam di blog menggunakan widget dari pihak ke-3 seperti clocklink, clockwidget dll yang kadang kurang simple, makan tempat juga bikin blog berat *maybe*. Tapi gw mau share cara pasang widget jam dan tanggal di blog menggunakan javascript yang lumayan ringan dan simple.

Sejak artikel terakhir tentang Review Film The Raid Redemption (yang filmnya terus naik peringkatnya di box office) kemaren, gw pusing mau posting apa (yah, ini blogger newbie yang selalu kehabisan sabun #eh) sampai kemudian tibalah saatnya #jengjeng muncul ide posting widget jam yang udah lama gw pakai di blog ini *dulu* dan di blog afika. Simple dan kurang menarik sih tapi aja juga yang minat muehehehe...

Kode aslinya didapat dari javascriptkit kemudian gw otak-atik dan ubah dikit agar sesuai dengan keinginan :p, oia kalau temen-temen mau belajar js, css, html disana juga bisa :). Ok langsung aja ini scriptnya

<script type="text/javascript"> window.setTimeout("jam()",1000); function jam() { var tanggal = new Date(); setTimeout("jam()",1000); document.getElementById("hasil").innerHTML = tanggal.getHours()+":"+tanggal.getMinutes()+":"+tanggal.getSeconds(); } </script> <table align=center style="border:0px cyan" bgcolor="transparent"><tr><td> <strong><font face="verdana"> <div id="hasil"></div> </font></strong> </td></tr></table>

Nah, setelah dapet kodenya mau diletakkan mana? Kalau gw yang newbie sih pilih cara gampang aja tinggal add widget >HTML/Javascript paste save, liat hasilnya.

Oia kalau cuma jam aja kurang lengkap sepertinya, hmmm gw tambahin sama hari, tanggal dan tahun pasti lebih manis tampilannya :D. Langsung ini codenya

<script> /*Current date script credit: JavaScript Kit (www.javascriptkit.com) Over 200+ free scripts here! Modified by anwar-lahai.blogspot.com */ var mydate=new Date() var year=mydate.getYear() if (year < 1000) year+=1900 var day=mydate.getDay() var month=mydate.getMonth() var daym=mydate.getDate() if (daym<10) daym="0"+daym var dayarray=new Array("Minggu","Senin","Selasa","Rabu","Kamis","Jum'at","Sabtu") var montharray=new Array("Januari","Februari","Maret","April","Mey","Juni","Juli","Agustus","September","October","November","December") document.write("<small><font color='f00088' face='Arial'><b>"+dayarray[day]+", "+montharray[month]+" "+daym+", "+year+"</b></font></small>") </script>

Masalah dimana diletakkan itu terserah sobat, kalau gw sih di campur atau di gabungin sama widget jam diatas biar manis seperti tampilan dibawah ini...

Sekian postingan singkat gw tentang Cara Memasang Widget Jam dan Tanggal di Blog Dengan JavaScript semoga bermanfaat :),

"Biar jelek asal gak copas"

Rating: 4.5

Posted by: Anwar Sofii