Home
Tukaran Link
Pasang Iklan
Contact Me
Drop Shadow Mempercantik Tampilan Gambar
Drop Shadow adalah sebuah efek bayangan yang timbul pada suatu objek, bisa pada sebuah kotak, tabel, dan gambar. Coba anda perhatikan gambar yang ada pada setiap postingan blog ini. Semua gambar tersebut memiliki bayangan yang membuat tampilannya menjadi lebih menarik. Untuk membuat drop shadow bisa kita lakukan pada beberapa software photo editing seperti Adobe Photoshop. Tapi gimna jika semua postingan kita memiliki gambar yang akan diberi shadow dan jumlahnya banyak? Duh, bisa pusing jadinya... Tenang, dengan membaca tips ini sampai tuntas anda akan mengetahui cara memberi drop shadow pada gambar postingan dengan hanya menggunakan kode css yang simpel.
Berikut Cara Membuat Drop Shadow Gambar
1. Login ke akun Blogger anda, lalu pilih Layout > Edit HTML
2. Cari kode ]]></b:skin>, lalu paste kode css berikut tepat di atasnya:
.drop-shadow img {
background:url(http://i30.tinypic.com/1qsh1h.jpg) no-repeat right bottom;
padding: 5px 10px 10px 5px;
}
3. Cari kode <data:post.body/>, lalu ganti kode tersebut dengan kode berikut:
<div class='drop-shadow'><data:post.body/></div>
4. Terakhir, klik Save Template dan lihat hasilnya.
Selamat mencoba...
Jangan lupa kasih komentar ya...
Bagikan Artikel Ini!
:))
:)]
;))
;;)
:D
;)
:p
:((
:)
:(
:X
=((
:-o
:-/
:-*
:|
8-}
~x(
:-t
b-(
:-L
x(
=))
42 komentar:
bikin berat ga mas?
Gak berat kok...
Ukuran gambar background cuma 3kb, jadi boleh dibilang gak nambah beban blog...
3 kb cukup berat...musik box sekitar 1,7 kb..label cloud sekitar 2,8 kb bahkan lebih
Terima kasih infonya
@Ossy: Ya ossy, tapi menurut saya tidak apa2 kalau hanya 3kb...
makasih mas, aas tips nya!! smoga makin update blognya!!
ini fungsinya untuk semua gambar di page blog y?
boleh coba!! tapi klu gx terlalu berat dipertahankan deh widget yg satu ini...
@artiirhamna: Trik yang saya jelaskan ini hanya untuk gambar yang ada di setiap postingan.
Kalau untuk semua gambar yang ada di blog lain lagi, begini kodenya:
img {
background:url(http://i30.tinypic.com/1qsh1h.jpg) no-repeat right bottom;
padding: 5px 10px 10px 5px;
}
dan taruh kode itu di atas kode ]]></b:skin>
wah bro.... semakin elite aja blognya... penuh inspirasi...
bro..., radhityaNotes.com buat event nech.., Lo bisa di bilang Kontes SEO, Award yang radhityanotes.com berikan adalah adalah sejumlah uang tunai. Space iklan barner dan Iklan Mini di 11 jaringan Iklan Online Gratis selama 1 thun.
saya berharap master Blog dan master SEO ini biosa ikut berpartisipasi.., Lumayan buat cari duit tambahan, nambah temen, naikin Trafik blog..
Untuk selengkapnyan mampir yach sob...
kelaitan lebih enak diliat klo ada efek bayangan ya.:D
@Radhitya: Ya ntar gw coba lihat bro...
@gambutku: Ya donk, kan keliatan lebih hidup tu gambar...
ok dech coba dulu, efek ini bisa menarik pengunjung untuk rajin datang lagi, aku sudah punya efek weak, jika di gabung dengan efek ini menarik nggak ya...?
keren sob.. coba dulu..
hehe, udah praktek. hasilnya kuerennnnn bro. makasih ye udah share. kalo gak percaya. liat aja langsung blog ane.
klo bikin bayangan pada badan blog atau bingkai/border tampilan blog (mksud saya sisi luarnya gt) bisa ga? bagi donk ilmunye.
@sandhioke: Maaf, kalau yang itu saya belum tahu caranya...
mantap bro....
thanks a lot....
:p:p:p:p:p:p
siiip gan
makasih tipsnya dah kulaksanakan dan....
'berhasil'
:)0 gak temu nih yang ini :-t
Keren bro .... makasih untuk informasinya
info yg bgt thx sob :)]
mw tanya nh bro kl mw bikin tab kl kursor d arahin ke tab muncul slidebar gmn y thx infox bls d blog gw y bro..gw newbie nh hihihi ;))
bagus nich....
dicoba dulu yach....
terima kasih :D
mantap deh...
tips yang bagus sekali, praktis untuk dipraktekkan, thanks
TEMPLATE BLOG GUE LATAR BELAKANGNYA HITAM... BISA GA GAN??? MOHON PENCERAHANYA.. HTTP://MEMO-XP.BLOGSPOT.COM
COBA DI TENGOK
ini kalo kita upload gambar ya mz...??
maz tuker link ya ^_^
bingung masalah html-nya bozz
thanks ats tips"nya....
mantap infonya gan...
thank's infonya
Ikut gabung sisni ea
sukses terus ea
jangan lupa mampir balik ya gan
ditunggu ya updatean terbarunya
lanjutkan !!
thank's and good luck !!
artikelnya cukup menarik, thank's gan
Pengen sih pasang drop shadow ini, tp sayang di blog saya kayanya kurang cocok.
Btw makasih mas ilmunya.
Ijin jalan2 mas, penasaran sama artikel yang laen.
Saya Sangat BerTerima kasih Atas Bantuan Angka Ritual MBAHâ?¦Angka MBAH EROK PRANAL Tembus 100%â?¦Saya udah kemana-mana mencari angka yang mantap selalu gak ada hasilnyaâ?¦sampai- sampai hutang malah menumpukâ?¦tanpa sengaja seorang teman lagi cari nomer jitu di internetâ?¦Kok ketemu NomoR MBAH EROK PRANAL..Saya coba beli Paket 4D ternyata Tembusâ?¦dan Bagai di sambar Petir..Ternyata Angka Ritual Ghoib MBAH EROK PRANALâ?¦Yang SaYa Minta Tembus 4Dâ?¦Baru kali ini saya mendapat angka ritual yang benar-benar Mantapâ?¦Bagi saudara yang ingin merubah Nasib seperti sayaâ?¦Anda Bisa CALL/SMS Di Nomer MBAH EROK PRANAL 085 377 797 151.(((Buktikan Aja Sendiri Saudara-Saudari)))
artikelnya menarik,..