Cara Membuat Lightbox WooCommerce

Salah satu kendala terbesar yang dihadapi konsumen saat berbelanja online adalah menemukan informasi produk dengan cepat. Faktanya, menurut laporan Forrester, 45% orang dewasa online AS akan meninggalkan pembelian online mereka jika mereka tidak dapat menemukan jawaban cepat untuk pertanyaan mereka .

Dengan menambahkan lightbox WooCommerce dengan fungsionalitas tampilan cepat ke toko online Anda, Anda akan dapat menciptakan alur pengguna yang lancar dan memberikan pengalaman belanja online tanpa gesekan kepada pelanggan Anda. Dengan kata lain, pelanggan Anda akan dapat menemukan semua yang mereka butuhkan – produk, detail produk, dan informasi harga – tanpa harus mengeklik satu pun halaman produk.

Pada artikel ini, kami akan menggali lebih dalam mengapa Anda mungkin mempertimbangkan untuk menggunakan plugin lightbox WooCommerce di toko online Anda. Kami juga akan memandu Anda melalui tutorial langkah demi langkah untuk menunjukkan cara membuat lightbox WooCommerce dengan tampilan cepat dalam empat langkah mudah.

Mari kita mulai!

Mengapa Anda Membutuhkan Plugin Lightbox WooCommerce

Sebagai pemilik toko WooCommerce, Anda mungkin sudah tahu bahwa pelanggan harus mengunjungi halaman produk individual untuk mempelajari lebih lanjut tentang setiap produk. Namun, ini tidak selalu menghasilkan pengalaman berbelanja yang intuitif dan ramah pengguna.

Dengan plugin lightbox WooCommerce, Anda dapat membiarkan pelanggan:

• Lihat gambar produk, galeri, dan detail di lightbox.
• Pilih opsi produk (misalnya variasi dan jumlah) dan tambahkan ke keranjang belanja mereka.

Dan bagian terbaiknya adalah mereka dapat melakukan semua ini langsung dari halaman toko utama atau halaman kategori. Anda dapat memilih untuk menyertakan informasi seperti gambar atau galeri produk, variasi dan atribut, pemilih jumlah, tombol tambahkan ke troli, dan detail produk tambahan seperti harga, ulasan, dan kategorinya.

Berbeda dengan alur pengguna WooCommerce default, memiliki plugin lightbox WooCommerce yang juga memiliki fitur galeri memungkinkan Anda untuk meningkatkan pengalaman belanja online pelanggan Anda. Itu membuatnya lebih mudah untuk melihat gambar dan galeri produk dan dengan cepat menemukan semua detail produk WooCommerce yang penting. Ini sangat berguna untuk toko online yang menjual produk yang berfokus pada gambar seperti pakaian, perhiasan, fotografi, atau barang hadiah.

Berikut adalah beberapa manfaat utama menggunakan plugin untuk membuat lightbox dengan fungsionalitas tampilan cepat:

• Tidak perlu mengedit file php apa pun. Setelah Anda menginstal dan mengaktifkan plugin, itu akan secara otomatis membuat lightbox tampilan cepat. Tidak perlu mengedit file functions.php .
• Gaya kustom dengan CSS. Anda dapat menyesuaikan lightbox agar sesuai dengan merek Anda tanpa harus mengedit file CSS.
• Mendukung. Anda juga mendapatkan akses ke dukungan pelanggan dari pengembang plugin yaitu Barn2 Media.

Cara Menggunakan WooCommerce Quick View Pro untuk Membuat Lightbox Tampilan Cepat

Inilah yang Anda perlukan untuk membuat lightbox WooCommerce dengan fungsionalitas tampilan cepat:

• Toko bertenaga WooCommerce dengan beberapa produk ditambahkan ke dalamnya.
• WooCommerce Quick View Pro — plugin lightbox WooCommerce yang responsif.

Langkah #1: Instal dan Aktifkan WooCommerce Quick View Pro

Setelah Anda membeli plugin WooCommerce Quick View Pro, masuk ke situs WordPress Anda dan instal serta aktifkan. Selanjutnya, buka halaman pengaturan plugin ( WooCommerce > Settings > Products > Quick view ) dari dashboard WordPress.

Masukkan kunci lisensi yang Anda terima di email konfirmasi pembelian di opsi Kunci lisensi . Klik tombol Simpan perubahan di bagian bawah layar untuk melanjutkan.

Jika Anda mengunjungi halaman toko utama toko online Anda, Anda akan melihat bahwa tombol Quick View telah ditambahkan langsung di bawah gambar produk. Tergantung pada tema yang Anda gunakan, mungkin terlihat seperti ini:

Dan ketika Anda mengkliknya, ia meluncurkan lightbox WooCommerce yang menampilkan gambar, galeri, nama, harga, deskripsi, SKU, dan kategori produk.

Langkah #2: Pilih Bagaimana Pelanggan Meluncurkan Lightbox WooCommerce

Dengan WooCommerce Quick View Pro, Anda dapat memilih bagaimana pelanggan meluncurkan lightbox produk. Buka WooCommerce > Pengaturan > Produk > Tampilan cepat sekali lagi dan temukan bagian Opsi .

Anda dapat membiarkan pelanggan meluncurkan lightbox dengan:

• Tampilkan tombol Tampilan Cepat di toko. Mengklik tombol Tampilan cepat langsung di bawah setiap gambar produk. Anda juga dapat mengubah teks tombol dan memilih untuk menampilkan/menyembunyikan ikon tombol.
• Buka Quick View dengan mengklik nama produk atau gambar di toko. Mengklik nama atau gambar produk.

Anda dapat memilih untuk mengaktifkan salah satu opsi atau keduanya! Penting juga untuk diingat bahwa, secara default, mengklik nama atau gambar produk akan mengarahkan pelanggan ke satu halaman produk. Mengaktifkan Open Quick View dengan mengklik nama produk atau gambar di opsi toko memungkinkan Anda menonaktifkan opsi ini.

Langkah #3: Tampilkan Gambar Produk di Lightbox (Dengan Tampilan Cepat)

Salah satu fitur rapi yang ditawarkan dengan WooCommerce Quick View Pro adalah memungkinkan Anda memilih apa yang ingin Anda tampilkan di lightbox.

• Produk yang berpusat pada citra. Jika Anda menjual produk yang berfokus pada gambar (seperti pakaian, sepatu, atau barang perhiasan), Anda ingin agar pelanggan dapat melihat gambar dan galeri produk di lightbox dengan zoom gambar.
• Produk dengan spesifikasi dan detail. Jika Anda menjual produk grosir, suku cadang komputer, atau musik, Anda mungkin ingin hanya menampilkan detail produk di lightbox.
• Produk yang dapat disesuaikan. Jika Anda menjual produk yang dapat disesuaikan atau produk dengan variasi, Anda ingin menampilkan gambar dan detail produk di lightbox.

Dari layar pengaturan plugin, temukan opsi tampilan Quick View dan putuskan apakah Anda ingin menampilkan Gambar saja , Detail produk saja , atau Gambar dan detail produk dalam tampilan lightbox.

Misalnya, jika Anda memutuskan untuk hanya menampilkan detail produk, lightbox WooCommerce Anda mungkin terlihat seperti ini:

Dan jika Anda memutuskan untuk menampilkan gambar di lightbox, Anda juga dapat memilih untuk menampilkannya sebagai Thumbnail atau Bullets . Berikut tampilan lightbox WooCommerce Anda jika Anda menampilkan gambar dan detail produk dengan opsi gaya thumbnail Galeri yang disetel ke Bullets :

Catatan: Jika Anda ingin menampilkan galeri produk, pastikan Anda menambahkan gambar ke galeri produk dari layar Edit produk produk . Anda dapat melakukan ini untuk setiap produk WooCommerce yang ingin Anda tampilkan banyak gambar.

Langkah #4: Tentukan Detail Produk Yang Akan Ditampilkan

Jika Anda memilih untuk menampilkan detail produk (atau gambar dan detail produk) di lightbox WooCommerce, maka Anda juga memiliki opsi untuk memutuskan detail produk mana yang akan disertakan dalam lightbox tampilan cepat.

Dari halaman pengaturan plugin, Anda dapat menggunakan opsi Detail produk untuk mencentang detail produk mana yang muncul di lightbox:

• Ulasan
• Harga
• Deskripsi Singkat
• Tambahkan ke troli tombol
• Informasi meta (seperti SKU dan kategori)

Jika, misalnya, Anda tidak ingin menampilkan opsi pembelian, cukup biarkan kotak centang Tambahkan ke troli tidak dicentang. Lightbox WooCommerce Anda mungkin terlihat seperti ini:

Kesimpulan

Lightbox WooCommerce dengan tampilan cepat memungkinkan pelanggan untuk:

• Temukan detail produk yang mereka cari dengan cepat
• Lihat gambar produk
• Pilih variasi
• Tambahkan produk ke troli

… tanpa harus mengunjungi satu halaman produk terlebih dahulu.

WooCommerce Quick View Pro memungkinkan pengguna untuk menambahkan lightbox dengan fungsionalitas tampilan cepat ke halaman toko dan halaman kategori utama mereka. Itu juga memudahkan untuk menyesuaikan tampilan dan nuansa lightbox dan bagaimana pelanggan berinteraksi dengannya.

Apakah Anda setuju bahwa lightbox WooCommerce dengan fungsionalitas tampilan cepat meningkatkan pengalaman belanja online pelanggan? Sampaikan pendapatmu pada bagian komentar di bawah ini!