Selasa, 04 Desember 2007

Cara buat random "Tips Of The Day"

Tips of the day merupakan tips singkat yang akan disampaikan kepada
pengunjung seriap hari, Tips ini bisa berisi apa saja, bisa berupa Tips Bisnis,
Tips memasak, Tips merawat mobil, Tips money online, Tips bercinta atau apalah terserah :), Asal jangan tips blogging karena dah punya om hehehe (emang siapa om ya :).
Sebenarnya Tips of the day disini cuma istilah saja...tips yang akan kita buat
nanti bukan disampaikan setiap hari melainkan tips ini akan berganti ketika
pengunjung melakukan refresh atau reload pada halaman blog.




Memangnya Tips of the day ini berguna om? tentu saja, dari pengamatan
saya selama ini banyak pengunjung menyukai tips singkat yang saya sampaikan di
blog saya -> PD bgt ya he100x. Selain berguna menampilkan informasi singkat, coba bayangkan ketika
kamu hanya ingin memposting artikel yang pendek misalkan hanya 250
karakter..masa mau dipaksa dipanjang-panjangin khan malah terlihat aneh,
disinilah untungnya memasang Tips of the day. Pengen tau cara buatnya...










Untuk kodenya bisa kamu pelajari script dibawah ini:




<a href="http://www.o-om.com">

<img border="0" style="float:left; margin:0 5px 5px 0;cursor:pointer;
cursor:hand;" alt="http://www.o-om.com" src="http://www.geocities.com/oom_directory/tipsOftheday.gif"/></a>

<font color="#333333"><b>Did You Know...</b>

<script language="JavaScript">

//store the quotations in arrays

tips = new Array(5);

tips[0] = "<i>tips bla bla bla 1</i>";

tips[1] = "<i>tips bla bla bla 2</i>";

tips[2] = "<i>tips bla bla bla 3</i>";

tips[3] = "<i>tips bla bla bla 4</i>";

tips[4] = "<i>tips bla bla bla 5</i>";

//calculate a random index

index = Math.floor(Math.random() * tips.length);

//display the quotation

document.write("\n");

document.write(tips[index]);

//done

</script>

</font>

<a href="javascript:location.reload(true)"> »»</a>
<a target="_blank" href="http://www.o-om.com/2007/12/cara-buat-random-tips-of-day.html">(?)</a>


<br/>


 






Sedikit penjelasan kode :




Kode warna hijau merupakan text tips yang akan
ditampilkan nantinya.




Kode warna pink merupakan icon/logo dari tips, kamu
bisa mengganti sesuai keinginan (caranya tinggal arahkan saja alamat url dimana
logo/icon kamu disimpan)




Kode warna merah merupakan kode singkat untuk melakukan
refresh atau reload halaman, ketika kode ini di klik maka setiap halaman di
refresh tips tersebut akan berganti secara otomatis (kode ini jangan di
modifikasi ya)






Bagaimana Menambah Tips nya biar banyak?




Lihat contoh kode diawah,  ini berarti kamu hanya menampilkan 5 tips.




tips = new Array(5);

tips[0] = "<i>tips bla bla bla 1</i>";

tips[1] = "<i>tips bla bla bla 2</i>";

tips[2] = "<i>tips bla bla bla 3</i>";

tips[3] = "<i>tips bla bla bla 4</i>";

tips[4] = "<i>tips bla bla bla 5</i>";




Kalau pengen nambah 10 atau 100 tips tinggal tambahin aja script kodenya.




tips = new Array(10);

tips[0] = "<i>tips bla bla bla 1</i>";

tips[1] = "<i>tips bla bla bla 2</i>";

tips[2] = "<i>tips bla bla bla 3</i>";

tips[3] = "<i>tips bla bla bla 4</i>";

tips[4] = "<i>tips bla bla bla 5</i>";

tips[5] = "<i>tips bla bla bla 1</i>";

tips[6] = "<i>tips bla bla bla 2</i>";

tips[7] = "<i>tips bla bla bla 3</i>";

tips[8] = "<i>tips bla bla bla 4</i>";

tips[9] = "<i>tips bla bla bla 5</i>";




Yang harus diingat jumlah tips dihitung dari 0 (nol) bukan dari angka 1.





Cara memasang pada blogger:




Pilih  Tempalate -> Elemen Halaman -> Tambahkan sebuah Elemen
Halaman -> Copy-Paste kode script nya -> simpan dan lihat hasilnya :)




Agar gak bingung kamu bisa install langsung ke blogger :)







 






Installer diatas dibuat dengan tools buatan oom Tools bisa di download pada link
dibawah ini:



install
blogger.zip
(1MB)




Baca tutorial pembuatannya di bawah ini:






http://www.o-om.com/2007/11/widget-installer-generator-for-blogger.html




Tidak ada komentar:

Posting Komentar