Thursday, March 29, 2012

Cara Memberikan Efek Zoom Pada Gambar di Blogger

Cara Memberikan Efek Zoom Pada Gambar di Blogger

Banyak cara untuk memperindah postingan pada Blogger. Tidak hanya memberikan gambar pada setiap postingan kita, namun juga memberikan sebuah efek pada gambar tersebut. Efek yang akan kita bahas disini adalah Efek Zoom. Berikut tutorialnya:


  1. Masuk ke Dashboard > Layout > Edit HTML
  2. Klik “Expand Widget Templates”
  3. Scroll ke bawah hingga </head> tag
  4. Masukkan kode berikut ini sebelum </head> tag


<script src=’http://wam8387.110mb.com/FancyZoom.js’ type=’text/javascript’/>
<script src=’http://wam8387.110mb.com/FancyZoomHTML.js’ type=’text/javascript’/>


  1. Ganti <body> tag dengan <body onload=’setupZoom()’>
Apabila pada template sudah terdapat kode <body onload=”setupZoom()”> bukan <body> tag, maka lewati langkah ini.
  1. Save template.
Sekarang kita telah menambahkan efek zoom pada gambar. Akan tetapi, untuk memperbesar / zoom gambar, kita harus memiliki form seperti berikut ini:



<a href=”Image link”><img src=”Image link” width=”200″ border=”0″ height=”200″ />



Kita harus mengganti 'image link' dengan alamat URL gambar. Kita juga dapat merubah ukuran tinggi dan lebar nya.

Catatan: Saat kita menambahkan efek ini lalu muncul tulisan HTML errors, klik kotak 'Stop showing HTML errors for the body of this post’ lalu publish postingannya kembali.


Cara Memberikan Efek Zoom Pada Gambar di Bloggerolroom4

0 comments:

Post a Comment