Galeri Gambar dengan Efek Visual LightBox (1)

Kembali lagi dengan tulisan tentang box, setelah sekian lama :D. Sesuai dengan judulnya, box yang akan saya bahas kali ini dirancang untuk diterapkan pada gambar (tidak menutup kemungkinan untuk penerapan pada elemen lainnya, tapi tidak akan saya bahas pada tulisan ini). Tidak seperti box yang lain, Visual LightBox dapat dikustomisasi dengan mudah (pemilihan thumbnail, template dsb) dan dapat dilakukan dengan beberapa kali klik, karena dikemas dalam bentuk perangkat lunak (software) yang mudah dimengerti. Hanya saja untuk penerapan atau pemasangannya di template Blogger diperlukan beberapa langkah yang cukup mbulet :D, tapi tenang, semoga tulisan ini dapat membantu Anda yang tertarik memasang Visual LightBox di template Blogger.

Visual LightBox dengan template Android

Tahap Pertama

Langkah 1
Pertama, siapkan bahan dan alatnya
Unduh Visual LightBox (yang sampai tulisan ini dibuat telah mencapai versi 4.3.2) lalu pasang (install) di PC Anda.

Langkah 2
Siapkan beberapa gambar (usahakan dengan ukuran yang berbeda-beda, agar efek resize-nya terlihat)
Jalankan Visual Lightbox.



Langkah 3
Tarik dan geser (drag and drop) gambar atau folder yang berisi gambar ke jendela Visual LightBox, atau klik tombol + hijau. Kita juga dapat memberi /mengedit judul pada tiap-tiap gambar pada tahap ini.



Langkah 4
Tuju Gallery --> Properties, untuk mengakses berbagai pengaturan Visual Lightbox.


Pada tab General, kita dapat mengatur beberapa fungsi seperti slide show, zoom effect, dll, silakan diatur sesuai selera (saya sengaja menonaktifkan fungsi auto play slide show).


Langkah 5
Selanjutnya tab Thumbnail, kita dapat memilih berbagai macam gaya thumbnail dan mengatur tampilannya, di sini saya memilih Simple Mac (with titles) pada bagian template.



Langkah 6
Pada tab Templates, terdapat bermacam pilihan template yang menarik, di sini saya memilih Android. Untuk versi gratisan, pengaturan watermark (sengaja) tidak diaktifkan. Hal ini dapat diakali dengan mengedit file javascriptnya (tidak disarankan :D).



Langkah 7
Kemudian di tab terakhir (tab Publish), kita tentukan folder penyimpanan elemen-elemen Visual LightBox yang nantinya akan dipasang pada template Blogger. Kita bisa juga langsung mempublish elemen-elemen tersebut langsung ke FTP server atau pun langsung ke file HTML.



Di sini saya memilih Publish to folder untuk kemudian diedit dan diunggah ke hosting gratisan seperti Fileave.com (lebih lanjut akan dijelaskan di Tahap Kedua tulisan ini). Setelah semua dirasa cukup, klik tombol Publish. Secara otomatis peramban (browser) Anda akan terbuka dan menampilkan hasil (setengah) jadi dari Visual LightBox.

Hasil setengah jadi Visual LightBox

Nah, sampai di sini dulu, silakan Anda otak-atik sendiri perangkat lunak Visual LightBox sampai bosan. Anda juga dapat mencoba memasang hasil setengah jadi Visual LightBox di template Blogger setelah membaca tulisan ini (caranya hampir sama dengan pemasangan Fancybox), atau tunggu tulisan saya selanjutnya, yang Insya Allah akan membahas cara memasang Visual LightBox di template Blogger :)




Ardhiansyam | Find us on Google+ | Kontak | Follower? klik di sini | Sitemap | Versi Mobile | ke atas ↑