Jika Anda adalah pemilik toko WooCommerce yang masih menyediakan metode pembayaran transfer bank, salah satu fitur wajib hadir adalah fitur form konfirmasi pembayaran.

Dengan menggunakan form konfirmasi pembayaran, Anda akan memiliki antrean konfirmasi yang langsung merujuk pada id order terkait. pelanggan punya satu tempat resmi untuk upload bukti bayar, dan Anda punya satu halaman berisi antrean konfirmasi yang bisa disetujui atau ditolak.

Nah, pada tutorial kali ini kita akan membuat form konfirmasi pembayaran dengan plugin Kubelio Payment Confirmation. Plugin ini bisa Anda gunakan secara Gratis dan langsung terhubung dengan WooCommece.

Salah satu kelebihan plugin ini, adalah file bukti transfer yang diupload oleh pelanggan akan disimpan pada folder private sehingga hanya bisa diakses oleh admin dan pelanggan itu sendiri.

Yuk, lanjut ke cara membuatnya.

Langkah 1: Install Plugin Kubelio Payment Confirmation

Untuk instalasi plugin, silakan ikuti langkah berikut:

1. Dari halaman Dashboard WordPress, silakan navigasi ke menu Plugins → Add New.
2. Pada kolom pencarian ketikan “Kubelio Payment Confirmation”.
3. Klik Install Now, kemudian klik Activate.

Setelah plugin aktif, plugin otomatis membuat satu halaman baru dengan judul Payment Confirmation di Pages, halaman ini dapat diakses dari url namadomain.com/payment-confirmation.

Langkah 2: Atur Setting Form Konfirmasi Pembayaran

Setelah proses instalasi selesai, silakan lakukan pengaturan plugin sesuai kebutuhan. Untuk melakukan pengaturan silakan navigasi ke menu Kubelio → Confirmation.

Secara default settingan plugin sudah sesuai untuk kebutuan umum fitur konfirmasi pembayaran, walaupun sebenarnya Kita tidak perlu lagi melakukan perubahan, tapi perlu di cek kembali untuk memastikan agar sesuai kebutuhan.

Tab General

Dari halaman ini, kita menentukan metode pembayaran mana yang butuh konfirmasi dan di mana tombol konfirmasinya ditampilkan.

Pada tab General tersedia opsi:

• Enable Confirmation: Enable/Disable fitur form konfirmasi.
• Applicable Payment Methods: metode pembayaran yang butuh konfirmasi. Pilih metdoe Direct bank transfer, jangan centang payment gateway otomatis, karena pembayarannya sudah terverifikasi sendiri dan pelanggan malah bingung disuruh konfirmasi.
• Display Location: Lokasi tombol konfirmasi muncul. Keempat lokasinya aktif secara default.
• Confirmation Page: halaman tujuan form. Opsi ini terisi otomatis saat plugin diaktifkan, menunjuk halaman Payment Confirmation yang dibuat tadi. Ganti hanya kalau Anda memindahkan shortcode ke halaman lain.
• Order Status After Approval: status order setelah konfirmasi disetujui. Defaultnya Processing, dan untuk sebagian besar toko itu sudah tepat karena artinya pesanan siap diproses.

Tab Upload Proof: Atur File Bukti Transfer

Bagian ini mengatur file bukti transfer yang boleh dikirim pelanggan.

• Allowed File Types: JPG, PNG, WEBP, dan PDF. Biarkan keempatnya aktif. Pelanggan yang pakai mobile banking biasanya mengirim screenshot, sedangkan yang pakai internet banking di desktop sering mengirim PDF.
• Max File Size (MB): batas ukuran file yang boleh dikirim, defaultnya 2 MB. Angka 2 sampai 5 MB sudah cukup untuk screenshot dari HP maupun PDF e-banking. Kalau pelanggan sering gagal upload padahal filenya kecil, batasan yang menahan biasanya bukan di sini melainkan kapasitas upload WordPress dari hosting Anda.
• Proof Upload Required: mewajibkan lampiran bukti. Aktifkan kalau Anda memang butuh gambarnya untuk mencocokkan mutasi rekening.
• Resize Large Images dan Convert to WebP: mengecilkan gambar yang diupload supaya hosting tidak cepat penuh. Screenshot atau foto dari HP biasanya memiliki ukuran yang besar dan bukti transfer tidak butuh resolusi setinggi itu.
• Attach Proof to Confirmation Received Email: melampirkan file gambar ke email yang diterima pelanggan, bukan ke email admin. Berguna sebagai catatan pelanggan. Matikan kalau Anda tidak mau menambah ukuran email keluar. Admin tidak pernah menerima file buktinya lewat email, jadi pengecekan bukti tetap dilakukan dari dashboard.

Tab Anti-Spam & Limits: Jaga Form dari Bot dan Kiriman Berulang

Tab ketiga ini menahan kiriman bot dan keamanan.

• Enable Honeypot: jebakan bot berupa field tersembunyi yang tidak terlihat pelanggan. Biarkan aktif, tidak ada efek sampingnya ke pelanggan asli.
• Submit Limit per Order: beri batas berapa kali satu order boleh dikonfirmasi, defaultnya 15. Isi 0 kalau mau tanpa batas. Jangan diisi 1, karena pelanggan yang salah upload jadi tidak bisa memperbaiki kiriman.

Simpan settingnya sebelum lanjut.

Langkah 3: Atur Email Notifikasi

Plugin ini memiliki 4 email yang akan dikirimkan, untuk pengaturannya Anda dapat melihatnya di WooCommerce → Settings → Emails.

1. Admin Notification: Dikirim ke admin toko jika ada user yang melakukan konfirmasi pembayaran.
2. Customer Received: Dikirim ke pelanggan untuk memberi info bukti bayarnya sudah diterima sistem.
3. Customer Approved: Dikirim ke pelanggan untuk untuk memberi info jika konfirmasi disetujui admin.
4. Customer Rejected: Dikirim ke pelanggan, konfirmasi ditolak, berisi alasan dan link untuk kirim ulang

Klik Manage pada masing-masing email untuk mengganti dan mengatur email. Tiap email bisa dinyalakan atau dimatikan, dan subject serta heading-nya bisa diganti. Yang bisa diganti penerimanya hanya Admin Notification. Tiga email pelanggan selalu dikirim ke billing email order, jadi field Recipient-nya memang tidak ditampilkan WooCommerce.

Jika email dari website Anda selama ini tidak terkirim, masalahnya bukan di plugin ini melainkan di cara WordPress mengirim email. Untuk mengatasinya Anda bisa mengganti protokol email dengan menggunakan SMTP, lihat panduan setting email SMTP di WordPress.

Alur Konfirmasi Pembayaran dari Sisi Pelanggan dan Admin

Sebelum kita uji, alurnya perlu jelas dulu, supaya Anda tahu bagian mana yang bermasalah kalau ada yang tidak jalan.

Dari sisi pelanggan

1. Checkout dan memilih metode pembayaran transfer bank.
2. Tombol konfirmasi pembayaran muncul di halaman Thank You, dan link konfirmasi pembayaran juga dikirim melalui email bersama detail pesanan.
3. Pelanggan melakukan pembayaran dengan cara transfer ke rekening bank yang tertera.
4. Pelanggan membuka form konfirmasi, mengisi data, dan upload bukti transfer.
5. Bukti transfer terkirim, lalu muncul status Under Review.
6. Pelanggan menerima email bahwa bukti bayarnya sudah diterima.

Dari sisi admin

1. Admin menerima email pemberitahuan ada konfirmasi baru.
2. Admin membuka WooCommerce → Confirmations. Pada halaman ini, akan ditampilkan semua konfirmasi pembayaran yang dilakukan pelanggan. Bagian ini menampilkan nomor order, nama pelanggan, total, thumbnail bukti bayar, tanggal upload, dan status.
3. Cocokkan id pesanan, nominal dan tanggal transfer dengan mutasi rekening bank Anda.
4. Klik Verify pada konfirmasi berstatus Pending untuk membuka detailnya.
5. Klik Approve kalau dananya sudah masuk. Status order otomatis berpindah sesuai Order Status After Approval, dan pelanggan menerima email persetujuan.
6. Klik Reject kalau ada yang tidak cocok. Alasan penolakan wajib diisi, dan pelanggan menerima email berisi alasan itu plus link untuk kirim ulang.

Selama status konfirmasi masih Pending, status pesanan tidak akan berubah. Jadi tidak ada risiko pesanan terkirim sebelum dananya masuk.

Masalah Umum dan Cara Mengatasinya

Halaman form kosong atau formnya tidak tampil.

Dari halaman admin, navigasi ke menu Pages, cari halaman Payment Confirmation, kemudian pastikan isinya masih memuat shortcode [kubelio_payment_confirmation].

Shortcode inilah yang menampilkan formnya. Kalau terhapus, tambahkan lagi lewat satu blok Shortcode, lalu simpan.

Halamannya terhapus atau mau dipindah.

Buat halaman baru (langkahnya ada di panduan membuat halaman di WordPress), isi dengan shortcode [kubelio_payment_confirmation], publish, lalu pilih halaman itu di opsi Confirmation Page pada Kubelio → Confirmation.

Kesimpulan

Setelah kita menambahkan fitur form konfirmasi pembayaran, sekarang pelanggan tidak lagi bertanya “konfirmasi ke mana?”, dan Anda tidak lagi menebak bukti transfer itu milik order nomor berapa.

Demikian tutorial cara menambahkan form konfirmasi pembayaran di WooCommerce dengan menggunakan plugin Kubelio Payment Confirmation. Jika Anda masih memiliki kendala atau pertanyaan terkait tutorial ini, silakan tuliskan dikolom komentar.