Integrasi dengan Contact Form 7

Dengan mengintegrasikan plugin Contact Form 7 Kamu ke WatZap.id, Kamu bisa dengan mudah mengirimkan pesan notifikasi WhatsApp otomatis ketika ada customer atau pelanggan yang submit form.

Untuk mengintegrasikan Contact Form 7 dengan WatZap.id, Kamu bisa melihat pada video berikut ini.

Jadi awal mula untuk mengintegrasikan Contact Form 7 dengan WatZap, Kamu bisa masuk ke menu API Keys & Apps.

Klik Menu API Keys and Apps

Kemudian pastikan ada minimal 1 nomor yang dihubungkan ke API.

Hubungkan Nomor API

Setelah itu, Kamu perlu menginstall dan aktivasi terlebih dahulu plugin Contact Form 7 di WordPress Kamu.

Install Contact Form 7

Jika plugin Contact Form 7 sudah berhasil terpasang di WordPress Kamu, langsung saja masuk ke menu Contact > Contact Forms.

Contact Forms

Kemudian Kamu bisa klik tombol “Add New” untuk membuat Form baru.

Contact Add New

Lalu pada bagian ini Kamu bisa tulis nama Form sesuai yang diinginkan.

Isi Nama Form

Nah, dibagian isi Form, pastikan Kamu menambahkan label Nomor WhatsApp (Cek di video untuk cara menambahkannya).

Tambahkan Label Nomor WhatsApp

Jika sudah, Kamu bisa langsung klik tombol “Save“.

Klik Save

Maka akan muncul Shortcode. Copy Shortcode yang muncul tersebut.

Copy Shortcode

Kemudian Kamu perlu meng-install plugin Elementor. Jadi Kamu bisa install terlebih dahulu plugin Elementor seperti biasa.

Install Elementor

Jika Elementor sudah di-install, Kamu bisa langsung ke menu Pages > Add New.

Pages Add New

Kemudian Kamu bisa isi Nama Form, atur Template, lalu klik tombol Publish.

Masukkan Nama Form

Setelah itu Kamu bisa klik tombol Edit With Elementor.

Klik Edit With Elementor

Nah, pada bagian ini, Kamu bisa klik icon “+”.

Klik Icon Plus

Kemudian pilih yang 1 Structure.

Pilih Structure

Pada bagian Widget, Kamu cari widget HTML. Lalu drag and drop Widget HTML tersebut.

Drag and Drop HTML

Kemudian pada bagian HTML Code, Kamu Paste shortcode Contact Form 7 yang tadi sudah di-Copy.

Paste HTML Code

Jika sudah semua, klik tombol “Update“.

Klik Update

Setelah di-Update, Kamu bisa klik icon Preview Changes untuk melihat hasilnya.

Preview Changes

Ini adalah hasil form dari Contact Form 7 yang tadi sudah dibuat. Kamu bisa langsung Copy URL-nya.

Copy Link

Selanjutnya, Kamu masuk ke plugin WatZap. Jadi pastikan Kamu sudah memasang plugin WatZap di WordPress.

Untuk memasang plugin WatZap di WordPress, Kamu bisa klik pada bagian “Download WordPress API Plugin“.

Download WordPress Plugin

Selanjutnya Kamu perlu memasang plugin WatZap di WordPress. Untuk cara pasangnya sama seperti memasang plugin pada umumnya, dimana Kamu tinggal import saja file plugin WatZap yang sudah di-download sebelumnya.

Install WatZap

Maka akan muncul plugin WatZap pada WordPress Kamu. Kamu bisa langsung masuk ke menu Custom Form pada plugin WatZap.

Pilih Custom Form

Lalu klik tombol “+ Add New Form“.

Klik Add New Form

Nah, pada bagian Integration, Kamu pilih yang Contact Form 7. Kemudian klik Next.

Pilih Contact Form 7

Pada bagian ini, Paste URL Form yang tadi sudah Kamu Copy. Lalu klik icon Search.

Masukkan URL Form

Maka akan muncul informasi dari Form tersebut. Pada bagian ini, Kamu bisa mengubah Integration Name dan isi pesan yang nantinya akan dikirimkan ke user yang mengisi form tersebut.

Isi Form

Kamu juga bisa mengatur untuk menambahkan Country Code pada Form atau Redirect ke halaman lain setelah user mengisi form.

Atur Country Code

Jika Kamu juga ingin menerima pesan notifikasi apabila ada orang yang mengisi form, Kamu juga bisa mengaturnya. Caranya dengan klik “Send Notification to Admin“.

Klik Send Notification to Admin

Lalu masukkan isi pesan notifikasi yang akan diterima, dan jangan lupa masukkan nomor Kamu. Jika sudah, klik tombol Next.

Isi Pesan Admin

Jika sudah muncul notifikasi seperti ini, itu tandanya Kamu sudah berhasil mengintegrasikan Contact Form 7 ke WatZap.

Berhasil Integrasi