Friday, March 25, 2011

Membuat Gallery Di Blogger

Hay Sob! Salam Rhenz Blog!!! Keberadaan Suatu Galeri Di Blog Terkadang Juga Di Butuh Sebagaimana Keberadaan Forum Dan GuestBook? Mengapa? Karena Di Gallery Kita Bisa memuat Album Yang Menunjukkan Ciri Khas Blog Kita Kepada Para Pengunjung. Jadi Para Pengunjung Bisa Lebih Mengetahui Makna Dari Blog Kita.
Sebagian Orang Dan Blogger Menyatakan Membuat Blogger Itu Sulit Dengan Bukti Survey Dari 38 Orang, Hanya Sekitar 6-7 Orang Yang Mengatakan Mudah. Sebenarnya Membuat Gallery Tidak Lah Sesulit Yang Dibicarakan, Karena Yang Kita Butuhkan Hanya Mengubah Sedikit Kode Html Dan Mem-pastenya.
Jadi Bagi Kalian Yang Ingin Membuatnya Tidak Perlu Khawatir, Karena Menurut Rhenz Membuat Gallery Di Blog Relatif Mudah Dan Cepat Di Banding Guestbook, Forum, Atau Shoutmix. Karena Kita Tidak Perlu Registrasi Atau Masuk Ke Halaman Web Tersebut. Yang Kita Butuhkan Hanyalah Script.
Kalo Pingin Buat Gallery, Ikuti Aja Langkah Di Bawah:
1) Login Ke Blogger Anda
2) Masuk Ke Posting > Edit Laman
3) Pilih Buat Laman Baru
4) Tulislah Di Judul Laman Dengan Judul "Blog Gallery"(Terserah Anda)
5) Pada Bagian Model Posting Pilihlah Edit HTML(Bukan Compose)
6) Paste Kode Di Bawah Ini Dan Langkah"nya

<div class="snap_preview"> <div> <span style="color: #0066ff; font-size: medium;">My Gallery</span></div> <style type="text/css"> .gallery{margin:auto;}.gallery-item{float:left; width:25%;} .gallery-caption { margin-left: 0; } </style> <div class="gallery snap_nopreview"> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a4.sphotos.ak.fbcdn.net/hphotos-ak-snc6/168899_166791820035877_100001151799967_316928_8246598_n.jpg" target="_blank"> <img border="0" height="150" src="http://a4.sphotos.ak.fbcdn.net/hphotos-ak-snc6/168899_166791820035877_100001151799967_316928_8246598_n.jpg" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a8.sphotos.ak.fbcdn.net/hphotos-ak-snc4/46056_127505157297877_100001151799967_137396_10296_n.jpg" target="_blank"> <img border="0" height="150" src="http://a8.sphotos.ak.fbcdn.net/hphotos-ak-snc4/46056_127505157297877_100001151799967_137396_10296_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a8.sphotos.ak.fbcdn.net/hphotos-ak-ash2/46940_127507027297690_100001151799967_137404_3247539_n.jpg" target="_blank"> <img border="0" height="150" src="http://a8.sphotos.ak.fbcdn.net/hphotos-ak-ash2/46940_127507027297690_100001151799967_137404_3247539_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a6.sphotos.ak.fbcdn.net/hphotos-ak-ash2/41165_127503330631393_100001151799967_137360_1804643_n.jpg" target="_blank"> <img border="0" height="150" src="http://a6.sphotos.ak.fbcdn.net/hphotos-ak-ash2/41165_127503330631393_100001151799967_137360_1804643_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a7.sphotos.ak.fbcdn.net/hphotos-ak-snc4/34564_112602538788139_100001151799967_77429_2669166_n.jpg" target="_blank"> <img border="0" height="150" src="http://a7.sphotos.ak.fbcdn.net/hphotos-ak-snc4/34564_112602538788139_100001151799967_77429_2669166_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a4.sphotos.ak.fbcdn.net/hphotos-ak-ash2/37253_112602872121439_100001151799967_77430_7657340_n.jpg" target="_blank"> <img border="0" height="150" src="http://a4.sphotos.ak.fbcdn.net/hphotos-ak-ash2/37253_112602872121439_100001151799967_77430_7657340_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a2.sphotos.ak.fbcdn.net/hphotos-ak-snc6/180313_166790833369309_100001151799967_316917_2344996_n.jpg" target="_blank"> <img border="0" height="150" src="http://a2.sphotos.ak.fbcdn.net/hphotos-ak-snc6/180313_166790833369309_100001151799967_316917_2344996_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a4.sphotos.ak.fbcdn.net/hphotos-ak-ash1/166500_177528518945834_100000660611849_469871_1162111_n.jpg" target="_blank"> <img border="0" height="150" src="http://a4.sphotos.ak.fbcdn.net/hphotos-ak-ash1/166500_177528518945834_100000660611849_469871_1162111_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a6.sphotos.ak.fbcdn.net/hphotos-ak-snc3/26662_110737178936311_100000000892480_270603_4840207_n.jpg" target="_blank"> <img border="0" height="150" src="http://a6.sphotos.ak.fbcdn.net/hphotos-ak-snc3/26662_110737178936311_100000000892480_270603_4840207_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a1.sphotos.ak.fbcdn.net/hphotos-ak-ash1/25209_110656788944350_100000000892480_268906_3558247_n.jpg" target="_blank"> <img border="0" height="150" src="http://a1.sphotos.ak.fbcdn.net/hphotos-ak-ash1/25209_110656788944350_100000000892480_268906_3558247_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a3.sphotos.ak.fbcdn.net/hphotos-ak-ash1/25209_110656785611017_100000000892480_268905_594657_n.jpg" target="_blank"> <img border="0" height="150" src="http://a3.sphotos.ak.fbcdn.net/hphotos-ak-ash1/25209_110656785611017_100000000892480_268905_594657_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a8.sphotos.ak.fbcdn.net/hphotos-ak-ash1/25209_110656778944351_100000000892480_268903_5166746_n.jpg" target="_blank"> <img border="0" height="150" src="http://a8.sphotos.ak.fbcdn.net/hphotos-ak-ash1/25209_110656778944351_100000000892480_268903_5166746_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a6.sphotos.ak.fbcdn.net/hphotos-ak-snc3/25209_110656648944364_100000000892480_268900_6468434_n.jpg" target="_blank"> <img border="0" height="150" src="http://a6.sphotos.ak.fbcdn.net/hphotos-ak-snc3/25209_110656648944364_100000000892480_268900_6468434_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a5.sphotos.ak.fbcdn.net/hphotos-ak-snc3/25209_110656782277684_100000000892480_268904_5894294_n.jpg" target="_blank"> <img border="0" height="150" src="http://a5.sphotos.ak.fbcdn.net/hphotos-ak-snc3/25209_110656782277684_100000000892480_268904_5894294_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a7.sphotos.ak.fbcdn.net/hphotos-ak-snc3/29809_125302720813090_100000000892480_330938_5561322_n.jpg" target="_blank"> <img border="0" height="150" src="http://a7.sphotos.ak.fbcdn.net/hphotos-ak-snc3/29809_125302720813090_100000000892480_330938_5561322_n.jpg" width="200" /></a> </dt> </dl> <dl class="gallery-item"> <dt class="gallery-icon"><a href="http://a4.sphotos.ak.fbcdn.net/hphotos-ak-snc4/74894_131865313536548_100001392398963_201996_7371253_n.jpg" target="_blank"> <img border="0" height="150" src="http://a4.sphotos.ak.fbcdn.net/hphotos-ak-snc4/74894_131865313536548_100001392398963_201996_7371253_n.jpg" width="200" /></a> </dt> </dl> </div> </div>


7) Keterangan Tulisan:

  • Ubah Tulisan Berwarna Merah Dengan URL Gambar
  • Ubah Tulisan Berwarna Biru Dengan Link Apa Bila Gambar Ditekan
  • Ubah Tulisan Berwarna Kuning Untuk Mengubah Ukuran Gambar
  • Angka 25% adalah prosentase untuk membuat foto berjajar menyamping 4 kolom (rumusnya: 100% dibagi 4 = 25%)
  • Bila ingin menambah jumlah foto tinggal copy saja mulai kode <dl class="gallery-item"> sampai dengan kode </dl> demikian pula jika ingin menguranginya.
  • Dalam menuliskan kode harus benar-benar rapat, jangan menggunakan enter, bila masih terdapat ruang kosong maka fungsikanlah backspace untuk menghapusnya sehingga kode menjadi rapat.

8) Terbitkan Laman
Kalau Udah Ok, Silahkan Lihat Contohnya DISINI
Happy Blogging

No comments:

Post a Comment