Membuat Efek Drop Shadow Pada Foto di Blog

Rabu, 21 November 2012

Foto atau gambar lebih bisa membuat orang jadi lebih lama ingat, selain itu dengan menampilkan gambar atau foto sebagai ilustrasi juga membuat blog menjadi lebih menarik. Orang akan lebih ingat dengan visualisasi blog daripada tulisan, karenan memang konon katanya sebuah paduan warna dalam foto gambar lebih tertanam pada memori otak dari pada hanya sekedar teks.

Dulu, di Download-Sadega juga pernah dibahas, cara membuat label berputar - putar. Sekarang kita akan belajar membuat efek drop shadow untuk gambar atau foto yang ditambahkan sebagai widget. Kita ingat kembali, efek shadow adalah sebuah efek bayangan yang timbul pada suatu objek, bisa pada sebuah kotak, tabel, dan gambar. Kita tidak perlu mengedit foto itu, hanya menambahkan beberapa kode css efek shadow pada foto sudah terlihat.

Cara Membuat Efek Drop Shadow Pada Foto

Login ke akun blogger.com
Pilih Tata Letak
Lalu tambahkan Tambah Gadget > HTML/Javascript

Kemudian masukan kode berikut ini:

Login ke akun blogger.com
<style type="text/css">
.efekshadow{ background:#fff; padding:2px;  border:1px solid #fff;
-moz-box-shadow: 0 0 5px 5px #888;
-webkit-box-shadow: 0 0 5px 5px #888;
border-radius:5px;
-moz-border-radius:5px;
}
</style>
<a href="http://twitter.com/sonicheguevara" target="blank"><img class="efekshadow" src="https://twimg0-a.akamaihd.net/profile_images/2312189562/ddm8q41q3ioi43to04je_reasonably_small.jpeg" /></a>

Kode yang berwarna merah adalah URL link yang dituju dan URL gambar atau foto, kamu bisa menggantinya sesuai dengan keinginanmu. Simpan jika sudah selesai.

Good Luck ^^

Download-Sadega