Cara Membuat Gambar yang Berubah-ubah di Setiap Halaman Blog

 

Bila kita menampilkan gambar pada suatu halaman blog, blog tersebut akan terlihat lebih menarik. Akan lebih menarik lagi bila gambar tersebut berubah-ubah tiap kali kita melakukan reload/ membuka halaman baru. Bagaimana caranya membuat gambar yang dapat berubah-ubah di setiap halaman blog? Salah satu caranya adalah dengan membuat javascript seperti di bawah:

<script language="JavaScript">
var img_width = "200";//lebar gambar
var img_height = "200";//tinggi gambar
var img_title = "gambar blog";//teks yang muncul ketika mouse diarahkan ke gambar
var ad=new Array()

//masukan url gambar Anda disini
ad[0]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT3Wv9vPhhAhvWTGMhyKJ2RSjGH8y4jpK4ciZMKqMWhxtme9boHF_UDj121JLsA07gOQZCRQn1t4x7ZYqomqKugFgJBv3vfzRzuJn_2AMXb291w-x4diZ9cptXVFqlK2C1K-6680nE3bsh/s400/maxthon.png';
ad[1]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLH9b-DVO4sOwcgLikXIn2fZN61gseUi-OW-fcSPrrVEU_LMErWngzSxLU9iaIqdopoP17MWP6kUlH7_hHNGVc4SOmKeBK3W-KavPw7sgJksyWTvc3lHcWD588Js5IX9euYdYWHTq9xa0k/s320/hosting%20gratis%20indonesia.png';
ad[2]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJW958j_86Bclbg1vgtYzeG9JQVJ7hL9Ov71wBSor1hmKMZA1GJzzPuyQmMFqWLgXvqg9EHgxS1iyFjL2q5a34PIDyuZn96XZMlUd2BsRbC_g9OOf7bNJiZivs453jMtr932mW2Apuvm8O/';
ad[3]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIs7Am1qGsyRPWAyhrTxYM44E6nurdnKZFLXb3b7BOLHQ3UbpqPoSTeOIvEmrI3nosu3MOlXe1OUwsEaTbMZmLIUPskcl6OeUPFr9mPXKqmov37Jzct1T_L1p1_S8NMsZYTfrFsfCgVqpu/s400/asteroid%20dan%20comet.jpg';
ad[4]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiz-sTCwQUWjyXa2x9aTO54n5l8pY3TkKWt68Yq42trU1iBRCGGhDkeNOq2V2QjBiRdI1prMwekgYY1eUs5h3DvlsGBRg8w-VsHoHKFKFsN7Zbk4Wz0IkvoKILu0q6E2FNMdA6BeABOmxTD/';

var links=new Array()
//masukan url tujuan/ kosongkan
links[0]='http://hayekstutorialblog.blogspot.com/';
links[1]='http://hayekstutorialblog.blogspot.com/';
links[2]='http://hayekstutorialblog.blogspot.com/';
links[3]='http://hayekstutorialblog.blogspot.com/';
links[4]='http://shayekstutorialblog.blogspot.com/';

var xy=Math.floor(Math.random()*ad.length);
document.write('<a href="'+links[xy]+'" target="_blank"><img src="'+ad[xy]+'" width="'+img_width+'" height="'+img_height+'" alt="'+img_title+'"></a>');
</script>

Catatan:
*Pada teks yang berwarna merah, silahkan ganti dengan keinginan Anda.

Cara membuatnya:
1. Masuk ke akun blogger Anda.
2. Pilih Design/Rancangan dan pilih Page Element
3. Pilih Add a Gadget/ Tambah gadget
4. Masukkan Script di atas
5. Klik Save jika sudah selesai
6. Lihat hasilnya!

Artikel Terkait