How to Start a Blog? Panduan Membuat Website Hanya 30 Menit

Cara Membuat Gallery Lightbox Responsive di WordPress

Cara Membuat Galeri Foto Lightbox Responsive di WordPress. Apakah Anda seorang dengan profesi sebagai desainer atau fotografer yang memiliki website dengan WordPress dan sedang mencari cara untuk menampilkan gambar hasil karya Anda dengan mudah dan menyusun gambar-gambar menjadi sebuah gallery yang indah? Jika iya, maka Anda sudah tepat sampai menemukan artikel ini karena disini saya akan membahas secara lengkap bagaimana membuat gallery photo di WordPress dengan menggunakan plugin Lightbox.

Pada dasarnya, WordPress saat ini secara default sudah mendukung untuk membuat gallery image tanpa perlu menginstall plugin tambahan, tapi tentu saja karena gallery WordPress ini adalah fitur bawaan maka Anda tidak akan menemukan fitur-fitur lebih seperti yang dibawa oleh plugin. Selain itu saat ini juga banyak tema WordPress yang dibuat khusus secara default memiliki fungsionalitas built-in untuk dapat menampilkan portfolio. Namun sekali lagi dengan memanfaatkan tema seperti tersebut Anda tidak akan leluasa menampilkan gambar-gambar atau gallery di area-area tertentu yang Anda inginkan sebagaimana yang plugin dapat lakukan.

Responsive Lightbox by dFactory

Di library plugin WordPress saat ini banyak sekali ditemukan plugin untuk membuat gallery, dan ini tentu akan membingungkan Anda untuk memilih mana WordPress lightbox plugin yang terbaik untuk Anda. Untuk menghemat waktu pencarian Anda disini saya akan memperkenalkan satu plugin keren untuk membuat gallery di WordPress yang bernama Responsive Lightbox by dFactory. Tapi sebelum itu mari kita mulai dengan pengetahuan dasar tentang plugin ini.

Baca : Visual Slide Box Builder – Buat Slider Gallery WordPress yang Indah dan Mudah

Apa itu WordPress Lightbox?

Lightbox adalah cara menampilkan gambar atau video dengan overlay tampilan pop up dan pada bagian sisa dari sisi layar akan diredupkan sehingga pengguna benar-benar fokus pada konten yang ditampilkan, dan ini lah yang disebut sebagai fitur lightbox. Lightbox bisa berupa JavaScript (jQuery), atau CSS3 yang menggabungkan pendekatan elegan pada desain web Anda. Saat diimplementasikan, overlay gambar ditampilkan sedemikian rupa sehingga halaman web sebenarnya tetap terlihat di sekitar tepinya, namun pengguna dapat fokus pada elemen media (gambar atau video) yang ada. Teknik ini cukup berdampak dan digunakan untuk menampilkan gambar, opt-in form, buletin, slide, dll. Jika Anda menjalankan website fotografi atau desainer yang ingin menampilkan gambar-gambar karya Anda maka ini adalah cara yang bagus untuk menarik perhatian pengguna web Anda.

Gallery Lightbox Responsive

Dengan menambahkan WordPress Lightbox plugin di situs Anda maka akan menambah nilai lebih dan secara visual akan lebih menarik. Dengan tujuan membuat konten media Anda terlihat indah di semua perangkat, plugin lightbox WordPress bisa menjadi pilihan yang sangat penting bagi siapa saja yang memiliki banyak gambar di situs WordPress mereka.

Baca : Cara Membuat Galeri Foto di WordPress dengan Modula Gallery

Responsive Lightbox by dFactory Plugin

Responsive Lightbox by dFactory adalah plugin gratis yang dibuat oleh pengembang dFactory yang banyak digunakan oleh pengguna WordPress dan masih akan terus mendapatkan update. Plugin ini dilengkapi dengan beberapa skrip yang secara otomatis menambahkan lightbox ke galeri foto, link gambar, dan tautan video untuk Vimeo dan YouTube. Plugin ini sangat mudah disesuaikan. Anda dapat menampilkan gambar di single post sebagai galeri, memodifikasi ukuran gambar galeri, dan mengatur skrip agar berjalan berdasarkan kondisi. Anda dapat mengatur jQuery untuk memicu berdasarkan peristiwa.

Dan berikut beberapa fitur unggulan yang bisa Anda dapatkan dari Responsive Lightbox by dFactory :

  • Memiliki 7 skrip lightbox responsif (SwipeBox, prettyPhoto, FancyBox, Lightbox Nivo, Lightbox Gambar, Tos “R” Us, Featherlight)
  • Secara otomatis menambahkan lightbox ke galeri gambar WordPress
  • Secara otomatis menambahkan lightbox ke link gambar WordPress
  • Secara otomatis menambahkan lightbox ke link video WordPress (YouTube, Vimeo)
  • Mendukung galeri produk WooCommerce
  • Pilihan untuk menampilkan galeri gambar di single post
  • Pilihan untuk memodifikasi galeri WP asli menghubungkan ukuran gambar
  • Pilihan untuk mengatur judul galeri gambar dari judul gambar, keterangan, alt atau deskripsi sehingga gambar menjadi SEO friendly
  • Pilihan untuk memaksa lightbox sebagai pengganti dari galeri WP custom seperti galeri pot jetpack
  • Opsi untuk memicu lightbox pada kustom jquery event
  • Opsi untuk mengisi skrip dan gaya hanya di laman yang memiliki gambar atau galeri di konten pos
  • Masukkan selector untuk lightbox
  • Pengaturan yang sangat disesuaikan untuk masing-masing skrip lightbox
  • Mendukung WordPress multisite
  • Filter hook untuk embeddding script yang berbeda berdasarkan kondisi kustom (halaman, posting, kategori, id pengguna, dll.)
  • .pot file untuk terjemahan juga disertakan

Selain fitur-fitur diatas, Anda juga dapat menambahkan fitur lain lagi yang lebih menakjubkan dengan menambahkan ekstensi premium. Berikut beberapa ekstensi premium untuk plugin responsive lightbox by dFactory.

  • Photo & Art bundle ($69) : Semua ekstensi Lightbox Responsif untuk membuat situs Anda cantik dan fungsional tersedia dalam satu paket Photo & Art Bundle ini dan ditawarkan dengan harga terjangkau.
  • Justified Gallery ($19) : Ekstensi Responsif lightbox ini mengubah galeri asli WordPress menjadi galeri yang sesuai dengan gambar Anda menjadi tampilan justified grid.
  • Masonry Image Gallery ($19) : Ekstensi Responsive Lightbox ini memungkinkan Anda untuk dengan mudah mengubah galeri default Anda menjadi Pinterest / Tumblr seperti photoset.
  • Slider Gallery ($19) : Ekstensi Responsif Lightbox ini dapat mengubah galeri WordPress menjadi slider yang mengagumkan, ringan dan responsif sepenuhnya.
  • Lightcase Lightbox ($19) : Ekstensi Responsif Lightbox yang indah, fleksibel dan responsif menghadirkan berbagai jenis konten yang terkenal.
  • PhotoSwipe Lightbox ($19) : Ekstensi Responsive Lightbox ini akan menambahkan fitur gambar yang indah sepenuhnya responsif dan memberikan pengalaman hebat di semua perangkat, termasuk gerakan sentuh, zoom, social share.
  • Lightgallery Lightbox ($19) : Ekstensi Responsive Lightbox ini adalah ekstensi ringan dan ramah mobile untuk menampilkan gambar dalam lightbox layar penuh dengan transisi CSS3 yang unik.
  • Strip Lightbox ($19) : Ekstensi Responsive Lightbox ini adalah lightbox unik yang tampilkan keluar dari tepi layar Anda dan hanya menutupi sebagian halaman.

dFactory Product

Cara Membuat Gallery Lightbox di WordPress

Untuk membuat gallery WordPress Lightbox dengan plugin Responsive Lightbox WordPress ini sangat mudah karena langkahnya sama dengan membuat gallery WordPress default.

Pertama yang perlu Anda lakukan adalah instal WordPress lightbox plugin yang bernama Responsive Lightbox by dFactory melalui admin WordPress Anda.

Silahkan aktifkan plugin dan Anda akan melihat menu baru bernama “Responsive Lightbox” menjadi bagian submenu dari menu “Settings”. Silahkan klik menu tersebut dan Anda akan melihat halaman pengaturan plugin yang cukup sederhana.

Responsive Lightbox Settings

Pada “General Settings” ada beberapa pengaturan yang harus Anda centang dan pilih seperti Lightbox script (bagian ini untuk memilih effect gambar ditampilkan) dan centang pada bagian Galleries agar Gallery WordPress default akan ditampilkan dengan cara lightbox yang indah. Jika konfigurasi sudah Anda lakukan silahkan klik tombol “Save Changes”.

Responsive Lightbox Settings 2

Pada “Lightbox Settings” Anda akan menemukan pengaturan yang berbeda-beda tergantung pada Script yang Anda pilih pada bagian General Settings. Anda bisa melakukan konfigurasi sendiri atau meninggalkan bagian ini secara default. Jika konfigurasi sudah Anda lakukan silahkan klik tombol “Save Changes”.

Add Ons Responsive Lightbox

Pada “Add-ons” terdapat beberapa ekstensi berbayar yang akan menambah fitur dan fungsionalitas pada plugin Responsive Lightbox seperti yang sudah saya jelaskan pada ekstensi di bagian atas.

Add Media Gallery

Selanjutnya untuk membuat galeri WordPress, silahkan buat postingan baru atau mengedit postingan yang sudah ada. Taruh kursor mouse Anda pada area yang Anda inginkan untuk penempatan Gallery dan klik “Add Media”.

Create Gallery Lightbox

Media Library yang berisikan gambar-gambar milik Anda akan terbuka dan silahkan klik menu “Create Gallery” yang terdapat pada bagian kiri atas.

Edit Gallery Lightbox

Anda bisa mengupload gambar baru untuk Anda jadikan sebagai gallery dengan klik menu tab “Upload Files” atau memilih beberapa gambar yang sudah ada dari Media library Anda dengan cara klik masing-masing gambar yang Anda pilih sehingga muncul tanda centang. Jika sudah, silahkan klik tombol “Create new gallery” Dan Anda bisa menambahkan Caption, Title, Deskripsi dan Alt pada gambar, jika sudah silahkan klik “Insert Gallery” .

Gallery Lightbox Responsive

Sekarang semua gambar yang Anda pilih sudah masuk pada area editor Anda, jika masih ada yang kurang Anda masih bisa mengedit kembali dengan mengarahkan kursor pada gambar hingga muncul icon edit. Sekarang untuk melihat hasilnya, Anda klik tombol preview dan Anda akan melihat gallery Anda sudah siap dan klik gambar untuk melihat hasil dari tampilan lightbox dari plugin responsive lightbox by dFactory. Anda bisa melihat demo secara live disini ⇒ Responsive Lightbox Demo.

Jika Anda kurang puas dengan effect yang ditampilkan pada gallery Anda, Anda bisa kembali ke halaman pengaturan dan memilih script yang sesuai dengan keinginan Anda.

Baca : Cara Membuat Gallery dan Slideshow di WordPress

Dan itulah panduan lengkap cara mudah untuk membuat gallery lightbox yang keren di WordPress dengan menggunakan plugin responsive lightbox by dFactory. Semoga artikel ini bermanfaat buat Anda dan selamat mencoba.

Anda Terbantu artikel ini? Silahkan bergabung dengan centerklik di Twitter dan Facebook+.

Daftar isi Tutorial WordPress Terlengkap Gratis
10 top hosting!

Register Now: TOP 10 Hosting

Dapatkan Hosting Murah dengan Kualitas Terbaik. For Serious Blogger! View Deals

Niagahoster

Rp.26.000/Bln Free Domain, Unlimited Space & Bandwidth Get Host

IDCloudhost

Rp.30.000/Bln Free Domain, Unlimited Space & Bandwidth Get Host

Bluehost Hosting

$2.95/Month Free Domain, Unlimited Space & Bandwidth Get Host

iPage Hosting

$1.99/Month Free Domain, Unlimited Space & Bandwidth Get Host

SiteGround Hosting

$3.45/Month Free Domain, Unlimited Space & Bandwidth Get Host

Hostgator

$3.95/Month Free Domain, Unlimited Space & Bandwidth Get Host

Add a Comment

Your email address will not be published. Required fields are marked *