Senin, 20 Mei 2013

Memasang Efek Zoom pada Gambar di Blog

Cara memasang efek zoom pada gambar di blog hanya dari Tips SEO + Blog - PC 123 (klik kanan gambar-> Reload Image jika gambar ini tak terlihat)
Memasang Efek Zoom pada Gambar di Blog – Kali ini saya akan membahas tutorial lain tentang tips trik blogging, dimana efek zoom pada gambar ini merupakan permainan kode CSS. Efek zoom pada gambar ini merupakan efek yang akan membuat gambar menjadi lebih besar saat pointer mouse digerakkan diatas gambar. Sehingga, gambar yang kecil akan terlihat lebih jelas. Preview efek zoom pada gambar ini dapat dilihat di sini.
Efek zoom pada gambar ini dapat digunakan untuk membuat betah pengunjung blog, dan membuat mereka merasa nyaman di blog. Karena, dengan adanya efek zoom pada gambar ini akan membantu pengunjung melihat gambar yang ukurannya cukup kecil. Cukup dengan meletakkan pointer mouse diatas gambar, dan gambar akan membesar dengan sendirinya.
Oke, to the point saja. Inilah cara memasang efek zoom pada gambar di blog :
1.     Buka blog Anda.
2.     Pilih Template.
3.     Buatlah sebuah cadangan (backup) dari template blog Anda, lalu klik Edit HTML.
4.     Klik pada kode HTML yang muncul, dan tekan ctrl+f
5.     Pada kotak search: yang muncul, carilah kode ]]></b:skin.

Memasang efek zoom pada gambar di blog – Mencari kode ]]></b:skin pada menu Edit HTML (jika gambar ini tidak terlihat, klik kanan gambar ini, lalu pilih Reload Image).

6.     Jika sudah ketemu, pastekan kode berikut ini diatas/sebelum kode ]]></b:skin.
.post img:hover { -o-transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform: scale(1.3); -o-transform: scale(1.3); -webkit-transform: scale(1.3); }
7.     Silahkan melihat pratinjaunya dahulu dengan mengklik tombol Pratinjau template.
8.     Jika dirasa sesuai, klik Simpan Template.
Dengan adanya efek zoom pada gambar di blog ini, pengunjung blog Anda tidak akan kesulitan melihat gambar – gambar kecil di blog Anda. Dan tentu saja, kenyamanan dan pengalaman pengunjung blog Anda akan bertambah. Selamat mencoba!
Salam blogger!

Suka Artikel Ini? Yang Share Dapat Pahala Lho... Trims!

3 komentar:

  1. pertamax, bisa di coba nih gan

    BalasHapus
    Balasan
    1. @Holidan : Oke sob. Trims atas kunjungan dan komentarnya... :)

      Hapus
  2. Terimakasih script nya sob. saya dah coba berhasil.. sukses selalu

    BalasHapus

Kurang mengerti dengan artikel diatas, ingin menanyakan sesuatu yang kurang jelas atau ingin meninggalkan jejak? Silakan gunakan Kotak Komentar!. Jika Anda ingin meletakkan kode HTML pada kotak komentar, gunakan tools HTML Parser But, remember! Berkomentarlah dengan bahasa yang sopan, tanpa iklan, spam politik, porno, dan hal - hal negatif lainnya. Terima kasih!