Jumat, 01 April 2011

New ! Membuat Efek Zoom pada gambar dengan Expando

Sobat Sharelikers sekalian,tentunya kita ingin blog kita menjadi ringan dan tidak lola alias lambat loading.Ada beberapa cara yang bisa kita lakukan,diantaranya dengan memperkecil skala gambar.Namun Bagi kita para blogger yang ingin blognya cantik,tentu tidak ingin memperkecil gambar,dengan alasan tidak puas dengan tampilannya,ataupun dengan alasan lainnya.Mungkin diantara kita yang sudah menguji blog kita di tool online Optimizer yang akan melihat kelemahan blog kita,dan salah satunya pada kepadatan blog akibat gambar yang terlalu banyak dan beruukuran besar.Nah kali ini setelah saya blogwalking semalam suntuk,akhirnya saya dapat juga cara untuk mengatasinya,coba lihat Demo Berikut Ini ,menarik bukan?bagaimana caranya mari kita bongkar.

Berikut langkah-langkahnya :

1.Loggin ke Blogger

2.Lalu di Dasbor,klik Rancangan,kemudian seperti biasa,klik Edit html

3.Lalu,setelah itu,expand widget Templates,lalu cari kode </head>

4.Lalu copy Paste kode berikut ini diatas nya


<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>  <style type='text/css'> img.expando{ border: none; vertical-align: top; } </style>  <script src= 'http://zoomercript.googlecode.com/files/Yangpentingshare.js' type='text/javascript'/>

5.Lalu simpan template sobat.

6.Kemudian setiap mau membuat posting dengan gambar,sobat masukkan kode berikut ini di halaman posting dibagian htmlnya(di sebelah compose)untuk gambar yang diinginkan.

<img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 147px; height: 184px;" src="Masukkan Url gambar Anda disini" class="expando" border="0" />

7.sobat bisa mengganti ukuran tinggi(height) serta Lebar(width)nya sesuai selera sobat.
8.Oke sekarang terbitkan dan lihat hasilnya.

Catatan:
Bila kode diatas tidak berhasil ,maka ada baiknya anda menyimpan sendiri kode anda di brankas kode Google Anda bisa mendownload scriptnya dengan mengeklik dibawah ini,lalu untuk cara menyimpan kode file di google code tunggu postingan selanjutnya(sumber)

 Kredit For Blogonol.blogspot.com

0 komentar:

Posting Komentar