Home » , » Membuat Widget Date and Time Ala Ngeposta (Stylus Version)

Membuat Widget Date and Time Ala Ngeposta (Stylus Version)

Written By Unknown on Thursday, December 6, 2012 | 2:13 PM


Membuat Widget Date and Time Ala Ngeposta (Stylus Version) - Pada kesempatan kali ini saya ingin share sebuah tutorial tentang cara membuat widget date and time ala ngeposta (stylus version), sebenarnya pada postingan yang dulu saya juga sudah pernah membahas tutorial ini, namun pada postingan yang dulu tampilan widget date and time ala ngeposta yang saya share sangat simple dan biasa saja. Sedangkan pada widget date and time ala ngeposta yang akan saya share ini tampilannya lebih elegant / stylus.

Langsung saja simak cara membuat widget date and time ala ngeposta (stylus version) di bawah ini dengan baik dan seksama!

1. Login ke blogger.com menggunakan akun anda.
2. Masuk ke halaman "Tata Letak".


3. Klik "Tambah Gadget".


4. Kemudian pilih "HTML/JavaScript".


5. Lalu masukkan script kode berikut ini :

<div style="background: lime; background:
-moz-linear-gradient(top, green, lime); background:
-webkit-linear-gradient(top, green, lime); background:
-o-linear-gradient(top, green, lime); background:
linear-gradient(top, green, lime); border-right: 1px solid #000;
border-bottom: 1px solid #000; color: white;
padding: 5px 5px 5px 10px; height: 16px; font-weight:
bold; text-shadow: 1px 1px #000; margin: 0 auto;
-moz-border-radius: 5px; -webkit-border-radius: 5px;
-o-border-radius: 5px; border-radius: 5px;">

<script type="text/javascript">
now = new Date();

if (now.getTimezoneOffset() == 0) (a=now.getTime() + (7*60*60*1000))

else (a=now.getTime());
now.setTime(a);
var tahun=now.getFullYear()
var hari=now.getDay()
var bulan=now.getMonth()
var tanggal=now.getDate()
var hariarray=new Array("Minggu","Senin","Selasa","Rabu",
"Kamis","Jum'at","Sabtu")
var bulanarray=new Array("Januari","Februari","Maret","April","Mei",
"Juni","Juli","Agustus","September","Oktober","November","Desember")

document.write(hariarray[hari]+", "+tanggal+" "+bulanarray[bulan]+"
"+tahun)
</script> →

<script type="text/javascript">
window.setTimeout("jam()",1000);
function jam() {
var tanggal = new Date();
setTimeout("jam()",1000);
document.getElementById("ngeposta").innerHTML =
tanggal.getHours()+":"+tanggal.getMinutes()+":"+tanggal.getSeconds();
}
</script>

<span id="ngeposta"></span>

</div>

6. Setelah itu klik save/simpan, selesai dan lihat hasilnya...

Note :
Untuk previewnya bisa di lihat langsung pada gambar yang ada di atas, tampilan hasil jadinya kurang lebih seperti itu.

Cukup sekian dulu postingan tentang cara membuat widget date and time ala ngeposta (stylus version) ini, semoga bermanfaat bagi anda. Selebihnya saya mohon ma'af atas segala kekurangan yang ada. Terima kasih atas kunjungannya, salam sejahtera by ngeposta...

0 comments:

Post a Comment