MENAMPILKAN THUMBNAIL IMAGE DENGAN TOMBOL BUKA TUTUP

Satu lagi cara menampilkan image thumbnail, hanya ada sedikit perbedaan dari versi sebelumnya.
Perbedaan itu disamping ada tombol close (tombol penutup), juga dilengkapi dengan tombol untuk menampilkan image (tombol pembuka)
lihat contohnya distas..!!

LANGKAH PERTAMA :

1. Masuk ke Blogger.
2. Masuk Tata Letak dan pilih Edit HTML.
3. Copy script dibawah ini kemudian paste diatas kode </head>


<link href='http://sites.google.com/site/epgstudiosite/javascript/plusimageviewer1.css' rel='stylesheet' type='text/css'/>
<script src='http://sites.google.com/site/epgstudiosite/javascript/jquery.min.js' type='text/javascript'/>
<script src='http://sites.google.com/site/epgstudiosite/javascript/plusimageviewer2.js' type='text/javascript'>
</script>
4. Simpan Template

LANGKAH KEDUA

1. Masuk ke Entri Baru
2. Copy kode dibawah ini untuk menampilkan gambar thumbnail yang dilengkapi dengan tombol buka tutup
   
   
   <img src="alamat gambar " style="width:100px" data-plusimage="alamat gambar" data-plussize="700,466" />
• Yang berwarna merah merupakan alamat gambar yang akan tampil, satu untuk thumbnail dan satunya untuk tampilan penuh dalam ukuran aslinya.
• Yang berwarna biru merupakan ukuran yang tampil pada gambar thumbnail.
3. Kode diatas hanya untuk menampilkan satu buah gambar, silahkan anda perbanyak dengan cara yang sama seperti diatas.
4. setelah selesa, silahkan anda terbitka entri dan lihat hasilnya..!!!

Source : http://epg-studio.blogspot.com/2010/03/blog-post_08.html