Cara Membuat Gambar Berputar di Posting

Pernahkan sobat menjumpai gambar posting berputar ketika disorot oleh kursor. Ini digunakan agar tampilan blog sedikit lebih menarik. Kalau sobat blogger tertarik dan penasaran gimana cara membuatnya? Silahkan ikuti langkah – langkah cara membuatnya berikut ini :

1. Login blogger Anda 
2. Pilih Template > Edit HTML > klik Expand Template Widget 
3. Cari kode ]]></b:skin> (seperti biasa gunakan Ctrl + F) 
4. Copy kode dibawah ini dan Paste tepat diatas kode ]]></b:skin>
   
   .blogatap img{-moz-transition:all .8s ease-in-out;-ms-transition:all .8s ease-in-out;-o-transition:all .8s ease-in-out;-webkit-transition:all .8s ease-in-out;transition:all .8s ease-in-out}
   .blogatap img:hover{-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);-webkit-transform:rotate(360deg);transform:rotate(360deg)}
5. Kemudian Klik Simpan

Kemudian penulisan kode gambar entri atau posting seperti berikut (penulisan di HTML bukan Compose)

<div class="blogatap"><img src="http://link-gambar-anda.jpg" /></div>

Tapi kalau ingin mengatur ukuran gambar, kita bisa menambahkan kode height dan weight, dan nantinya akan menjadi seperti ini :

<div class="blogatap"><img src="http://link-gambar-anda.jpg" height="ukuran-tinggi" width="ukuran-lebar" /></a></div>

Selamat mencoba dan semoga bermanfaat.