Tutorial Blog: Menampilkan Jam, Hari dan Tanggal Pada Side Bar

Untuk mempercantik blog, kita bisa menampilkan jam, hari dan tanggal di side bar dengan sangat mudah. Bagi yang tidak biasa dengan Java Script, kita bisa cari script yang sudah jadi, kita tinggal copy paste aja. Dalam tutorial ini saya mengambil sebagian script dari http://www.acjavascripts.com, sebuah situs free java script.

Langkah-langkah:

1. Log in ke account blog anda


2. Pilih Layout


3. Masuk ke Element Halaman dan tambahkan HTML/Java Script elemen di mana anda menginginkannya.


4. Copy Script di bawah ini dan pastekan ke elemen halaman tadi.


5. Simpan perubahan dan jadilah sudah.

<form name="myForm">

<input value="Jamku..." name="clock" size="10" type="text"/></form>

<script language="JavaScript"><!--

function runClock(){

theTime = window.setTimeout("runClock()", 1000);

d = new Date();

hr = d.getHours();

min = d.getMinutes();

sec = d.getSeconds();

if(hr==0){ap=" AM";hr=12}

else if(hr <= 11){ap=" AM"}

else if(hr == 12){ap=" PM";hr=12}

else if(hr >= 13){ap=" PM";hr-=12}

if(min <= 9){min="0"+min}

document.myForm.clock.value=""+hr+":"+min+":"+sec+ap+"";}

runClock();

//--></script>

<script language="JavaScript">

<!--

function MakeArray(n) {

this.length = n

return this

}

monthNames = new MakeArray(12)

monthNames[1] = "Januari"

monthNames[2] = "Februari"

monthNames[3] = "Maret"

monthNames[4] = "April"

monthNames[5] = "Mei"

monthNames[6] = "Juni"

monthNames[7] = "Juli"

monthNames[8] = "Agustus"

monthNames[9] = "September"

monthNames[10] = "Oktober"

monthNames[11] = "November"

monthNames[12] = "Desember"

dayNames = new MakeArray(7)

dayNames[1] = "Minggu"

dayNames[2] = "Senin"

dayNames[3] = "Selasa"

dayNames[4] = "Rabu"

dayNames[5] = "Kamis"

dayNames[6] = "Jumat"

dayNames[7] = "Sabtu"

function customDateString() {

currentDate = new Date()

var theDay = dayNames[currentDate.getDay() + 1]

var theMonth = monthNames[currentDate.getMonth() + 1]

msie4 = ((navigator.appName == "Microsoft Internet Explorer") && (parseInt(navigator.appVersion) >= 4 ));

if (msie4) {

var theYear = currentDate.getYear()

}

else {

var theYear = currentDate.getYear() +1900

}

return theDay + "," + " " + currentDate.getDate() + " " + theMonth + " " + theYear

}

//-->

</script>

<table border="0" width="80%" cellpadding="0" cellspacing="0" align="center">

<tr>

<td colspan="2"><div align="center"> </div></td>

</tr>

<tr valign="baseline" bgcolor="#CCCCCC">

<div align="left"><font face="Arial, Helvetica, sans-serif" color="#000000" size="1"><strong>

<script language="JavaScript">

document.write(customDateString())

</script></strong></font></div></tr></table>

Jika Suka Posting ini, Tambahkan ke Technorati Favorites