Senin, 17 Agustus 2009



random rotating image untuk blogger dengan javascript

Tentunnya rekan-rekan sudah tahu apa yang dimaksud dengan random rotating image bukan??? yup...gambar yang berganti-ganti setiap kali halaman web di reload atau di refresh.


Sebelumnya saya telah membuat tulisan serupa di blog tutorial saya yang lama dengan judul posting" cara membuat random banner ads". tulisan mengenai random image tersebut murni utak-atik kode javascript yang saya lakukan yang kodenya di dapatkan dari situs javascriptkit, dari puluhan kode maka saya mendapatkan script terebut yang paling berhasil di aplikasi ke dalam blog. mengenai random rotating image Saya juga telah membuat tulisan terkait yaitu "random rotating image header on blogger" di blog saya yang lama juga. jadi silahkan di coba juga.


Nah, untuk saat ini saya juga ingin sharing cara membuat random rotating image lainnya yang dibisa di aplikasikan ke blogger.Sharing singkat ini saya lakukan karena hari-hari ini masih agak malas nulis, jadi cari materi blogger tutorial yang ringan-ringan saja.

Oke, tanpa banyak babibu, langsung menuju ke inti "cara membuat random rotating image on blogger dengan javascript"-nya



Untuk memasang script random image ini sebenarnya ada 2 jalan, yaitu melalui edit template secara langsung atau yang paling mudah melalui elemen halaman. Sekarang kita pakai cara yang paling mudah saja; melalui element halaman.




  • Dari dasbor blog pergi ke halaman elemen halaman dari blog yang akan dipasang random image ini dengan mengklik menu "Tata letak" dari blog yang dipiliih

  • Setelah halaman terbuka, klik "tambah gadget" lalu pilih yang "html/ javascript". klik " tambahkan ke blog".

  • kopi kode di bawah ini lalu pastekan di halaman tambah html/ javascript yang telah terbuka

    <script language="javascript">

    <!--

    var bdis = "<img src=\"";

    var edis = " style=\"border:none;\">";

    var rnumb = "";

    var img = "";



    rnumb += Math.floor(Math.random()*5);

    img = rnumb;



    if (img == "0") {document.write(bdis+ "http://www.imagehosting.com/picture0.jpg\"" +edis);}

    if (img == "1") {document.write(bdis+ "http://www.imagehosting.com/picture1.jpg\"" +edis);}

    if (img == "2") {document.write(bdis+ "http://www.imagehosting.com/picture2.jpg\"" +edis);}

    if (img == "3") {document.write(bdis+ "http://www.imagehosting.com/picture3.jpg\"" +edis);}

    if (img == "4") {document.write(bdis+ "http://www.imagehosting.com/picture4.jpg\"" +edis);}

    // -->

    </script>


    untuk kode
    random()*5)silahkan ganti dengan jumlah gambar yang akan di jadikan dalam rotating image ini.

    sedangkan kode dibawahnya yang diberi warna merah adalah lokasi peyimpanan gambar.silahkan ganti dengan jumlah gambar yang di inginkan.

  • simpan perubahan.

  • selesai.


Nah, ternyata gampang bukan membuat random rotating image di blogger?. jangan lupa mengunjung blog saya yang lama untuk membaca-baca tutorial mengenai random image ini.


ada yang punya script lain mengenai random rotating image ini, silahkan di sharing!!!


24 komentar:

Ramuni.net mengatakan...

Kalo tiap detik ganti gambar gmana mas :D

mas Aan mengatakan...

@ ramuni:
kalo tiap detik...bisa bisa aza sich,
tapi randomnya bukan random lagi mas, LARI ROTATING IMAGE namanya:-D

btw, makasih kunjungannya

mas Aan mengatakan...

@Rumah impian eros:
yach..kirain ga dapet loh mas dari kontest itu..eh taunya masih dapet walupun butut :-D
tapi sampe sekarang belum ada konfirmasi nich...`-(

RT12 mengatakan...

info yang bermanfaat ...sukses tuk anda

wiryo mengatakan...

wah keren nih tipsnya. makasih ya mas

mas Aan mengatakan...

@mas wiryo:
bisa aja mas wiryo ini....:-D

naura mengatakan...

salam kenal mas.. Tipsnya ok nih.. pengen nyoba jg.

thanks dah visst and komen mas..

mas Aan mengatakan...

@naura:
salam kenal juga..

Made Gelgel mengatakan...

kayaknya di blog saya gak bisa dipasang deh mas, templatenya gak cocok

sukses selalu ya mas Aan, blognya bagus nih

IHSAN mengatakan...

wah tutorialnya MANTAP bro

keep post ya?

NURA mengatakan...

salam sobat
wah kren blognya nich
random rotate image,,,ok banget sobat.
pingin mencoba jadinya,,,

salam kenal juga ya dari NURA
trims sdh kunjung dan komentar di blog NURANURANIKU.

mas Aan mengatakan...

@nura:salam kenal juga
@IHSAN:tentu..selagi hayat di kandung badan, tetap posting di blog :-D.makasih kunjungannya.

mas Aan mengatakan...

@Made Gelgel:
dicoba dari edit templatenya langsung aza bli..
btw, makasih kunjungannya yach..

Donny mengatakan...

thanx infonya sob...

Iklan Baris mengatakan...

hehehe gampang banget, cuma copy paste hihihihihi......baiklah, boleh di coba....ilmu yng bagus dan bermanfaat, gratis pula :D

Iklan Gratis

sda mengatakan...

wah keren nih artikelnya, jadi nyiapin gambar dulu, trs disimpan, mau berapa banyak, gitu ya?
tampilan blognya jadi bagus...
makasih tutorialnya.

salam kenal juga.

narti mengatakan...

tutorial yg sangat bermanfaat buat newbie seperti aku. makasih sharingnya.

Deny mengatakan...

info yg bagus bro..
jd kya update trus,
klo gambar2 di web ganti2 hehehe

genial ™ mengatakan...

wahh keren nniii.. tp barusan saiia masuk sini ko' rada bingung iia.. hhmmm.. gerangan apakah linkbuck ini?!??!

Saung Web mengatakan...

wah boleh juga dicoba nih... semoga Saung Web bisa.. btw makasih atas kunjungannya ya..

DUNIA POLAR mengatakan...

maksudnya tu seperti apa sih?? aku g ngerti cz g pernah tau :(

Taktiku mengatakan...

nice tutorial

mas Aan mengatakan...

@Donny, iklan Baris:thx juga dah berkunjung...
@sda:betull sekali!!!
@narti:saya juga newbi kok :-D
@Denny:terimakasih kunjungannya
@genial:linkbucknya menggangu yach!!! besok segera akan saya buang, maaf yach :-)
@Saung Web:makasih juga mas
@Dunia Polar:coba ja lihat salah satu gambar di sidabar blog ini yang kadang ganti kalau halaman di refres (pada lokasi iklan gratis, tapi baru satu gambar :-D )
@Taktikku:makasih yaaa.....

prafangga permana mengatakan...

Wuich keren tipsnya

Posting Komentar