Login ke blogmu, pilih >> Template >> Edit HTML >> klik Lanjutkan >> centang Expand Template Widget
Carilah kode ]]></b:skin>, untuk mempermudah pencarian tekan Ctrl + F dan jika sudah ketemu, copy dan pastekan kode dibawah ini tepat diatas kode ]]></b:skin>.
.hovergallery img{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-o-transform:scale(0.8);-webkit-transition-duration:0.5s;-moz-transition-duration:0.5s;-o-transition-duration:0.5s;opacity:0.7;margin:0 10px 5px 0}.hovergallery img:hover{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);box-shadow:0px 0px 30px gray;-webkit-box-shadow:0px 0px 30px gray;-moz-box-shadow:0px 0px 30px gray;opacity:1}
>> Kilk >> SimpanTemplate ,
Untuk memunculkan efek pada gambar maka copy-pastekan kode berikut pada postingan atau widget yang dimana sobat ingin menaruh gambar yang akan diberi efek. Berikut Codenya:
<div class="hovergallery">Url Gambar Milik Sobat </div>
Ganti teks berwarna Orange dengan link dari gambar sobat. Contohnya seperti dibawah ini:
SELESAI
jadi setiap memasukkan gambar harus disertai kode ya sob..
ReplyDelete@ Andi,kalau yang ini iya, ada code lain yang akan membuat semua gambar dalam blog mempunyai efek zoom.
ReplyDeletekalau mau yang simpel gini aja:
<div class="HOVERGALLERY"separator" style="clear: both; text-align: center;">url gambar</div>kalau pada postingan ada gambarnya code ini pasti ada sisipkan aja tulisan HURUF BESAR di atas,tentunya setelah code CSS nya dimasukan dalam template.
jd pingin masang Sob...
ReplyDeletemakasih sob infonya nice share.
@Nakusan,silakan di coba aja...moga sekses..D.
ReplyDelete