Berita Terkini
Loading...
Friday 4 April 2014

Membuat Efek Gambar Bergetar Pada Blogger

00:42

Niat Ngeblog - Jadi konsepnya adalah ketika cursor mendekati gambar yang telah kita beri widget ini maka widget ini akan memberi efek bergetar pada gambar. Trik ini juga bisa di terapkan untuk gambar iklan yang ada pada blog kita agar lebih menarik. Mau lihat demo widget keren ini? Silahkan berkunjung di blog Sebuah Dongeng dan lihat iklan Niat Ngeblog.

Bagai mana, sudah lihat? tertarik mengetahui cara pemasangannya? Ikuti langkah berikut dengan cermat dan teliti, karena sebagian besar ke gagalan di sebabkan tidak teliti dan buru-buru dan sisanya.... ya karena saya salah nulis kodenya hehehe

01. Buka account Blogger.

02. Silahkan menuju menu Edit HTML, jangan lupa untuk memberi tanda cek pada kotak Expand Widget Templates.

03. Copas kode berikut dan letakkan di atas ]]></b:skin> 

.gambargetar {
position: relative;
}

04. Beralih ke menu Page Elements, pilih Add a Gadget kemudian berlanjut ke HTML/JavaScript. Copas kode berikut dan Save.

<script src="http://situseo.googlecode.com/files/gambargetar.js?attachauth=ANoY7crTQ4Lxnhf7dmkwVCDEuTh7tAEnUb24VQITeydgTn0GgWS6i13WBvtATMNH-03ZLeomrsDAaJdTYlyazR9wt1cIcZXm2h5BMS3bFaRzpwe3BVjMe-I_pzEALIgg97q3b1EWvttUKoUP8X3qebNDdmwO20x_okkWFa3AV68yosoYqixie957Grgnn8lIWESG-jcKGZG78t4wvT6zh2Svz3cpYleeSYekUxbpT2LfB9Qj1Q6pHvA%3D&amp;attredirects=0" type="text/javascript"></script>

05. Sekarang tingal menambahkan widget untuk membuat efek getarnya.  Masih di menu Page Elements, Pilih Add a Gadget dan menu HTML/JavaScript kopas kode berikut. Tapi Edit dahulu kodenya sesuai punyak kamu.

<center><a title="NAMA-WIDGET" href="http://ALAMAT-BLOG.com/" target="_blank"><img style="left: 0pt; top: 0pt;" src=" http://ALAMAT-GAMBAR-IKLAN" onmouseover="init(this);rattleimage()" onmouseout="stoprattle(this);top.focus()" onclick="top.focus()" class="gambargetar"/></a></center>

Keterangan Kode :

Nama Widget : Ganti dengan nama widget kamu
Alamat Blog : Ganti dengan alamat Blog kamu, contoh : bloggerproo-id.blogspot
Alamat Gambar Iklan : Ganti dengan alamat gambar kamu, alamatnya bisa didapat dari photobucket, uploat dan dapatkan alamat gambarmu.

06. Save dan lihat hasilnya.

Selamat mencoba

0 komentar:

Post a Comment

 
Toggle Footer