Widget Commerce Suite: Mesin Checkout Elementor Super Cepat Tanpa WooCommerce

📌 Bosan mengatur WooCommerce yang berat hanya untuk berjualan 1-2 produk digital/undangan?

Membangun sistem pemesanan online beserta formulir penagihan seringkali melibatkan *plugin* raksasa yang membuat website melambat parah sembari memakan banyak sumber daya database. Widget Commerce Suite Luxee menjawab hal ini dengan menawarkan *one-page checkout* super ringan khusus Elementor (Vanilla JS AJAX Submission) tanpa melibatkan tumpukan kode *e-commerce* yang tidak dibutuhkan.

📖

Skenario Interaksi Sempurna (Direct Answer)

TL;DR: Cukup tarik widget Commerce Suite ke dalam kanvas landing page Anda. Fitur ini secara magis akan memanggil seluruh produk yang telah Anda buat di *Menu Commerce Suite → Products*, merender formulir biodata klien, serta sistem Kupon Diskon dan Ringkasan Total Harga otomatis (Real-time).

✨ Fitur Unggulan

Dynamic Product Grid: Menampilkan produk dalam bentuk kartu pilihan elegan (Grid 1 hingga 3 kolom) lengkap dengan fitur, *badge* kategori produk, dan harga aktual.
Single & Multiple Selection: Bebas tentukan *behavior* penjualan pendaratan Anda, apakah calon pembeli hanya boleh memilih maksimal 1 paket (Single/Radio), atau boleh nge-borong *bundle* berupa seleksi ganda (Multiple/Checkbox).
Sistem Kupon Terintegrasi: Tanpa ribet mengatur di menu *plugin* terpisah! Pelanggan bisa mengetikkan kode rahasia dan harga otomatis terpotong saat itu juga tanpa *reload* halaman.
Native AJAX Checkout: Order langsung diteruskan sebagai *Custom Post Type* lxwdk_order halus ke database secara sinkron asinkron tanpa *glitch* pemuatan (loading).

🛠️ Cara Penggunaan

Langkah 1: Menyortir Daftar Produk Tertentu (Opsional)

Pada tab Content → Product Selection, secara bawaan seluruh produk yang statusnya *Publish* (*Aktif*) akan ditampilkan otomatis. Namun melalui fitur Repeater Daftar Produk, Anda bisa dengan selektif menggunakan Select2 untuk memasang produk tertentu saja (contoh: hanya produk paket VVIP). Atur juga Grid Columns dan tipe pilihan di tahap ini.

Visual: Kontrol *Product Selection* di panel kiri Elementor.

Langkah 2: Mempersonalisasi Bidang Formulir Pelanggan

Masuk ke Form Fields. Formulir didesain untuk menyerap informasi dasar: Nama Lengkap, Email, dan WhatsApp. Anda bisa mengubah *label* setiap formulir ini, termasuk mematikan *toggle* Tampilkan Kolom Catatan jika Anda berjualan produk jadi yang tidak memerlukan permintaan khusus/*custom* pesanan dari pembeli.

Langkah 3: Mengaktifkan Sistem Kupon & Teks Penagihan

Lanjut ke bagian Coupon System, aktifkan tuasnya jika Anda sedang mengadakan *campaign* potongan harga. Kemudian pada blok Submit Button, ganti label tombol utama Anda (contoh dari "Pesan Sekarang" menjadi "Bayar & Amankan Slot"). Jangan lupa untuk menyelipkan *Teks Syarat & Ketentuan* pendukung di bawah tombol Submit.

Visual: Hasil dari antarmuka *Frontend* saat sistem kupon dan biodata klien diaktifkan.

Langkah 4: Bermain dengan Warna Style (Design System)

Tidak perlu koding CSS. Menuju tab Style Elementor Anda dapat mendedikasikan Brand Color untuk garis tebal penanda kartu saat produk tersebut di-klik (Active State), menyesuaikan besar *font* harga, sampai mengatur kelembutan lengkungan (Border Radius) pada kotak inputan *form* pembayarannya agar tidak terlihat kaku.

💡

Pro Tips Performa Taktikal

Hindari meletakkan lebih dari 1 Widget CSS "Commerce Suite" di dalam satu halaman *Landing Page* yang sama (misalnya satu di atas, satu di bawah), ini bertujuan mencegah tubrukan validasi form (conflict ID). Gunakan teknik autoscroll (Anchor) yang mengarahkan pembeli terjungkir ke *section block* tempat form ini bertengger.

🔗 Modul Ekosistem Terkait

Widget frontend ini memohon penguasaan kuat terhadap sistem inti (backend) di WordPress Anda:

💡 Pertanyaan Sering Ditanya (FAQ)

Kenapa produk saya tidak muncul di pilihan Elementor Editor?

Fitur ini menggunakan sistem Server-Side Rendering penuh demi keamanan *fetching* ke database. Jika produk yang baru saja Anda buat di dasbor belakang belum muncul, silakan tekan Update (Elementor) > Reload/Muat Ulang Layar agar data katalog produk mengambil siklus yang terbaru.

Bisakah saya berintegrasi langsung ke Payment Gateway (Midtrans, Xendit)?

Fokus mutlak pada versi ini adalah membebaskan alur jual beli dari proses kompleks bagi agensi dan layanan jasa (*Manual Transfer*) dipadukan Client Area. Dukungan langsung Payment Gateway Controller API akan direncanakan di peta jalan (roadmap) skala rilis *Mayor* Luxee di masa depan.

Apa fungsi dari pemilihan "Multiple/Bundle Selection" ?

Seketika layar beralih ke format *Checkbox*. Ini memfasilitasi bisnis yang mau konsumennya menumpuk belanjaan secara *ad-hoc* seperti "Pilih Paket Undangan Digital DITAMBAH Layanan Video Cinematic" agar mereka bisa memesan 2 komoditas sekaligus dalam 1 nota invoice tagihan saja!