Bingung ingin membuat tampilan gallery foto unik di blogspot dengan ukuran kecil yang ditata rapi seperti dibawah ini???
Mau tau cara membuatnya?
Berikut instruksi dalam pembuatannya (copy paste kode berikut dibawah ini):
<div class='snap_preview'><div><center><font color="#0066FF" size="4">Cara Membuat Tampilan Gallery Foto Unik di Blogspot</font></center></div>
<style type='text/css'>
.gallery {
margin: auto;
}
.gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 33%; }
.gallery img {
border: 2px solid #cfcfcf;
}
.gallery-caption {
margin-left: 0;
}
</style>
<div class='gallery snap_nopreview'><dl class='gallery-item'>
<dt class='gallery-icon'>
<img src="http://i109.photobucket.com/albums/n54/blue_generation04/Beamahakarya/IMG_0630.jpg" width="128" height="96" class="attachment-thumbnail" >
</dt></dl><dl class='gallery-item'>
<dt class='gallery-icon'>
<img src="http://i109.photobucket.com/albums/n54/blue_generation04/Beamahakarya/IMG_0631.jpg" width="128" height="96" class="attachment-thumbnail">
</dt></dl><dl class='gallery-item'>
<dt class='gallery-icon'>
<img src="http://i109.photobucket.com/albums/n54/blue_generation04/Beamahakarya/IMG_0642.jpg" width="127" height="96" class="attachment-thumbnail">
</dt></dl><br style="clear: both" /><dl class='gallery-item'>
<dt class='gallery-icon'>
<img src="http://i109.photobucket.com/albums/n54/blue_generation04/Beamahakarya/IMG_0672.jpg" width="127" height="96" class="attachment-thumbnail">
</dt></dl><dl class='gallery-item'>
<dt class='gallery-icon'>
<img src="http://i109.photobucket.com/albums/n54/blue_generation04/Beamahakarya/IMG_0673.jpg" width="128" height="96" class="attachment-thumbnail">
</dt></dl><dl class='gallery-item'>
<dt class='gallery-icon'>
<img src="http://i109.photobucket.com/albums/n54/blue_generation04/Beamahakarya/IMG_0674.jpg" width="128" height="96" class="attachment-thumbnail">
</dt></dl><br style="clear: both" />
<br style='clear: both'/>
</div>
</div>
(stop!! copy paste sampai disini)
Tugas Anda berikutnya,
Bila hanya ingin mengganti tampilan foto saja, Anda bisa rubah alamat gambar yang berwarna merah dengan alamat gambar yang Anda inginkan.
Namun Anda juga dapat mengotak-atiknya, bila sudah mengetahui/mempelajari bahasa HTML.
Mudah-mudahan bermanfaat,
Bagaimana menurut Anda??
20 Comments
udah sy baca ka..
ReplyDeletemakasih ya..
maaf jg nagih2 trus.. hehehe...
lepas copy, paste nya d mana ya?
ReplyDeleteberjaya!!
ReplyDeleteTrimas ya..
have a nice day!
Alhamdulillah nemu ini, makasih sob :)
ReplyDeleteThnkz Gan ,,,
ReplyDeleteVisit back please ,,
www.deevro.co.cc ,,
thnkZ ,,
wah terima kasih, pak. atas tutorialnya :)
ReplyDeletewah ini dia gan yang aku cari...tapi gmana buat zoom nya...?
ReplyDeletepunya saya kox gax rapi ya...apa ada ksalahan di kodenya...?
ReplyDeletemakasih pak de, walaupun awalnya susah tuk menyesuaikan ukuran gambar tapi sekarang udah bisa. trus saya + title ma gambar aku jadikan link.
ReplyDeleteWAH AKU MSH BLUM NGERTI
ReplyDeleteMuanteeeeeeeeeeptepteptep..Mas Uka!!
ReplyDeletehttp://www.alandiny.tk/2011/10/gallery-album-foto-alandiny.html
dicoba,tanks gan
ReplyDeletesiip, pateen.......
ReplyDeletenitip tukar link http://www.jubersradio.com/
ReplyDeleteKEREN
ReplyDeleteNGE BANTU BANGET
THANKS YA
SEKALIAN KUNJUNGI BLOG SAYA
http://fashiondar.blogspot.com/
simple sob, ane coba dulu deh.. ntar kalo makin belepotan ngadu dimari lagi.. hehehe.. salam kenal..
ReplyDeletemakasi mas informasinya, saya lihat demo nya kok ga bisa di klik ya?
ReplyDeletegimana cara agar photo kalau di klik jadi pop up windows?
Thanks
thx mas
ReplyDeletehttp://duniagame7.blogspot.com/
kalo judul nya membuat gallery foto simpel di blogspot lebih tepat mas daripada unik, tapi sekedar saran aja kok mas
ReplyDeleteTrima kasih atas sarannya..
ReplyDelete