Jika Anda memiliki toko online WordPress dan menggunakan metode pembayaran manual transfer bank, maka Anda wajib menyediakan fitur konfirmasi pembayaran. Fitur konfirmasi pembayaran akan mempermudah pelanggan menyelesaikan pesanan.

Pada tutorial kali ini kita akan membuat fitur konfirmasi pembayaran di WordPress dengan menggunakan plugin Contact Form 7. Contact Form 7 sendiri merupakan plugin form yang gratis dan mudah digunakan.

Yuk, simak tutorial lengkapnya!

Cara Kerja Form Konfirmasi Pembayaran

Cara kerja fitur Konfirmasi pembayaran di WordPress dengan menggunakan plugin Contact Form 7 sebagai berikut:

1. Pelanggan melakukan pembelian produk di website toko online Anda.
2. Pelanggan melakukan pembayaran sesuai dengan nominal ke rekening Anda.
3. Pelanggan melakukan konfirmasi pembayaran dengan mengisi form konfirmasi.
4. Admin menerima email konfirmasi pembayaran.
5. Admin mengecek nomor order dan jumlah pembayaran di rekening bank.
6. Admin mengubah status pesanan dan memproses pengiriman barang.

Apa itu Contact Form 7?

Contact form 7 adalah plugin WordPress yang berfungsi untuk membuat form input. Dengan menggunakan plugin ini, Anda dapat membuat berbagai macam jenis form seperti form kontak, form pendaftaran, form pertanyaan dan form konfirmasi pembayaran tentunya.

Lebih detail tentang contact form 7 dapat Anda lihat disini.

Kelebihan plugin Contact Form 7:

• Gratis: Anda dapat menggunakan plugin ini secara gratis.
• Lengkap: Semua kolom bisa Anda gunakan mulai dari kolom text biasa hingga kolom uplaod file.
• Fleksible: Jika, Anda mengerti HTML, Anda dapat mengubah layout dan mengintergrasikan dengan tema yang digunakan.
• Dukungan Add On: Tersedia banyak dukungan Add On untuk menambahkan fitur extra ke form yang dibuat dengna menggunakan plugin Contact Form 7.

Kekurangan plugin Contact Form 7:

• Tidak memiliki builder drag and drop yang mungkin bisa membuat pengguna baru mengalami kebingungan.

Jika Anda penguna baru, Anda tidak perlu khawatir karena pada tutorial ini, sudah tersedia kode yang bisa Anda copy paste untuk memudahkan dan mempercepat pembuatan form konfirmasi pembayaran.

Install Plugin Contact Form 7

Untuk instalasi plugin Contact Form 7, ikuti langkah-langkah berikut:

1. Dari halaman admin navigasi ke Plugins > Add New.
2. pada kolom pencarian ketikan “contact “.
3. Kemudian klik Install Now dan aktifkan Contact Form 7.

Membuat Form Konfirmasi Pembayaran

Setelah proses instalasi, saatnya kita membuat sebuah form konfirmasi pembayaran.

Untuk membuat form konfirmasi pembayaran di WordPress menggunakan Contact Form 7, ikuti langkah-langkah berikut:

1. Dari halaman admin, navigasi ke Contact > Add New.
2. Tuliskan judul fomulir

3. Masukan kode berikut untuk membuat form konfirmasi.

Pada bagian form, Anda bisa menambahkan text, email, url, text area sesuai kebutuhan.

Untuk lebih memudahkan membuat halaman konfirmasi di WordPress, silakan copy paste kode dibawah ini pada kolom Fom yang baru dibuat. Ganti bagian rekening tujugan dengan rekening bank yang Anda miliki.

Nama Lengkap <br>
[text* konfirmasi-name]

Email <br>
[email* konfirmasi-email]

No Order <br>
[text* konfirmasi-order]

Jumlah Transfer <br>
[number konfirmasi-jumlah]

Rekening Tujuan <br>
[select* konfirmasi-rekening "BNI" "Bank Mandiri" "BCA"]

Upload Bukti Transfer <br>
[file konfirmasi-file]

Catatan <br>
[textarea konfirmasi-catatan]

[submit "Konfirmasi Pembelian"]

Konfigurasi Email

Setelah fomulir konfirmasi pembayaran berhasil dibuat, sekarang saatnya mengatur konten email yang akan dikirimkan.

Pada bagian ini kita akan mengatur email tujuan dan isi dari email yang akan diterima admin website dan pelanggan.

Untuk mengatur konten email yang dikirimkan silakan klik tab Mail.

Mail 1

Mail 1 merupakan email yang akan dikirimkan ke email admin setelah pelanggan melakukan konfirmasi pembayaran.

Untuk pengaturan Mail 2 di plugin Contact Form 7, ikuti langkah-langkah berikut:

Untuk pengaturan Mail 1 di plugin Contact Form 7, ikuti langkah-langkah berikut:

1. Mail-tags: Kode bisa Anda sisipkan pada bagian email, mail tag berisi data yang diisi oleh pelanggan dari halaman konfirmasi.
2. To: Masukan alamat email admin, admin akan menerima email ketika pelanggan mengisi form konfirmasi.
3. From: Isikan alamat email sistem, alamat email ini ini harus sesuai dengan alamat domain Anda, bisa Anda isi dengan noreply@namadomain.com.
4. Subject: topik email, isi dengan “Konfirmasi Pembayaran”
5. Additional headers: untuk membuat cc, bcc, atau pesan tambahan.
6. Message Body: Masukan pesan yang akan dikirimkan ke admin sesuai mail tag map pada nomor 1
7. Use HTML content type: Centang opsi ini, opsi ini mengizinkan email dikirim dengan format HTML.
8. File Attchements: Masukan [konfirmasi-file], akan dikonversi dari file gambar atau bukti gambar di halaman konfirmasi.

Pada opsi From, alamat email harus sesuai dengan nama domain, alamat email ini tidak harus benar-benar ada. Contohnya gunakan email noreply@namadomain.com, noreply memberi infomasi pada penerima email agar tidak membalas email ini.

Contoh pesan email untuk admin

Pada bagian Message Body bisa Anda isi seperti contoh dibawah. Pesan akan dikirim ke admin dan mail tag akan dikonversi sesuai dengan input data yang dimasukan pelanggan.

Dari: [konfirmasi-name] <[konfirmasi-email]>

Detail Pesan:
Nama: [konfirmasi-name]
Email: [konfirmasi-email]
No Order: [konfirmasi-order]
Jumlah: [konfirmasi-jumlah]
Rekening Tujuan: [konfirmasi-rekening]
Catatan Tambahan: [konfirmasi-catatan]

Mail 2

Email 2 merupakan email yang dikirim ke pelanggan ketika berhasil melakukan atau mengirim konfirmasi pembayaran. Fungsi email 2 ini untuk menginformasikan bahwa konfirmasi telah diterima dan akan segera diproses.

1. Use Mail(2): Centang opsi ini untuk mengatifkan Mail 2.
2. Mail-tags: Kode bisa Anda sisipkan pada bagian email, mail tag berisi data yang diisi oleh pelanggan dari halaman konfirmasi.
3. To: Masukan alamat email admin, admin akan menerima email ketika pelanggan mengisi form konfirmasi.
4. From: Isikan alamat email sistem, alamat email ini ini harus sesuai dengan alamat domain Anda, bisa Anda isi dengan noreply@namadomain.com.
5. Subject: topik email, isi dengan “Konfirmasi Pembayaran”
6. Additional headers: untuk membuat cc, bcc, atau pesan tambahan.
7. Message Body: Masukan pesan yang akan dikirimkan ke pelanggan sesuai mail tag map pada nomor 1
8. Use HTML content type: Centang opsi ini, opsi ini mengizinkan email dikirim dengan format HTML.
9. File Attchements: Masukan [konfirmasi-file], akan dikonversi dari file gambar atau bukti gambar di halaman konfirmasi.

Contoh pesan email untuk pelanggan

Pada bagian Message Body bisa Anda isi seperti ini, pesan akan dikirim ke pelanggan dan text map akan dikonversi sesuai dengan input data yang dimasukan pada form konfirmasi.

Terima Kasih, konfirmasi pembayaran sedang kami proses

Detail Pesan:
Nama: [konfirmasi-name]
Email: [konfirmasi-email]
No Order: [konfirmasi-order]
Jumlah: [konfirmasi-jumlah]
Rekening Tujuan: [konfirmasi-rekening]
Catatan Tambahan: [konfirmasi-catatan]

Menambahkan Form ke Halaman Konfirmasi Pembayaran

Setelah selesai membuat form konfirmasi dan melakukan konfigurasi, sekarang saatnya untuk menampilkan form agar bisa diakses oleh pelanggan.

Untuk menampilkan form konfirmasi pembayaran, ikuti langkah-langkah berikut:

1. Dari halaman admin, navigasi ke menu Pages > Add new page
2. Buat halaman baru dengan nama “Konfirmasi Pembayaran”
3. Pilih block Contact Form 7
4. Kemudian pilih nama form yang telah dibuat sebelumnnya.
5. Klik Publish untuk menyimpan perubahan.

Kesimpulan

Setelah melakukan langkah-langkah di atas form konfirmasi pembayaran Anda siap digunakan, form konfirmasi ini sangat berguna bagi Anda yang menyediakan metode transfer manual melalui transfer bank.

Anda dapat meletakan link konfirmasi di menu utama atau memasukan pada email intruksi saat pelanggan melakukan checkout.

Selain menggunakan pembayaran manual, Anda juga dapat mengintergrasikan toko online WordPress dengan pembayaran otomatis. Dengan menggunakan pembayaran otomatis, admin akan menerima notifikasi jika pesanan sudah dibayar. Lihat daftar layanan pembayaran otomatis di Indonesia.

Demikian tutorial membuat form konfirmasi pembayaran di WordPress dengan menggunakan plugin Contact Form 7. Jika Anda memiliki pertanyaan terkait tutorial ini, silakan tinggalkan pesan di kolom komentar.