# 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. Sebelum integrasi dengan WatZap, pastikan Wordpress Kamu menggunakan PHP versi 7.4. Untuk mengintegrasikan Contact Form 7 dengan WatZap.id, Kamu bisa melihat pada video berikut ini. {% embed url="" %} Jadi awal mula untuk mengintegrasikan **Contact Form 7** dengan **WatZap**, Kamu bisa masuk ke menu **API Keys & Apps**. ![Klik Menu API Keys and Apps](/files/xzW0tARxSnZa5hnj18LQ) Kemudian pastikan ada [**minimal 1 nomor yang dihubungkan ke API**](/help/integrations/menambahkan-nomor-wa-untuk-api.md). ![Hubungkan Nomor API](/files/5gCy4OMxFqGcxZTsVFAG) Setelah itu, Kamu perlu menginstall dan aktivasi terlebih dahulu plugin **Contact Form 7** di **WordPress** Kamu. ![Install Contact Form 7](/files/HxGbanNC0hBDWQ5ujRpJ) Jika plugin **Contact Form 7** sudah berhasil terpasang di WordPress Kamu, langsung saja masuk ke menu **Contact > Contact Forms**. ![Contact Forms](/files/T38rOlOzfWelIzoucm26) Kemudian Kamu bisa klik tombol “**Add New**” untuk membuat Form baru. ![Contact Add New](/files/jmX9JRioKCZAU5PPEqyE) Lalu pada bagian ini Kamu bisa tulis nama Form sesuai yang diinginkan. ![Isi Nama Form](/files/ZTEnlIZms1YpMewSG2ok) Nah, dibagian isi **Form**, pastikan Kamu menambahkan **label Nomor WhatsApp** (Cek di video untuk cara menambahkannya). ![Tambahkan Label Nomor WhatsApp](/files/jDmt0Bm8IRXm9oF8ex0y) Jika sudah, Kamu bisa langsung klik tombol “**Save**“. ![Klik Save](/files/5VSTHsQVLZbEUugTLSjC) Maka akan muncul **Shortcode**. **Copy Shortcode** yang muncul tersebut. ![Copy Shortcode](/files/FX7UNm10r0heep5JNq9E) Kemudian Kamu perlu meng-install plugin **Elementor**. Jadi Kamu bisa install terlebih dahulu plugin Elementor seperti biasa. ![Install Elementor](/files/bucWAHnFep0Cx9sphGtS) Jika Elementor sudah di-install, Kamu bisa langsung ke menu **Pages > Add New**. ![Pages Add New](/files/OWH1J2aNU7FN0JQ4r6zN) Kemudian Kamu bisa isi **Nama** **Form**, atur **Template**, lalu klik tombol **Publish**. ![Masukkan Nama Form](/files/VHq7IvyAVSV4gdWq0cfh) Setelah itu Kamu bisa klik tombol **Edit With Elementor**. ![Klik Edit With Elementor](/files/ktbdfYgUbqk0S8Rf19FY) Nah, pada bagian ini, Kamu bisa klik icon **“+”**. ![Klik Icon Plus](/files/ft1oaJyvSnJ6TLsZCBkh) Kemudian pilih yang **1 Structure**. ![Pilih Structure](/files/L2AbljDk1LPgwixLx3JM) Pada bagian **Widget**, Kamu cari widget **HTML**. Lalu drag and drop Widget HTML tersebut. ![Drag and Drop HTML](/files/O83sbHlGlKjpaIUnFWXY) Kemudian pada bagian **HTML** **Code**, Kamu **Paste** **shortcode Contact Form 7** yang tadi sudah di-Copy. ![Paste HTML Code](/files/hdCVjQ1zY9gY76VwxKkm) Jika sudah semua, klik tombol “**Update**“. ![Klik Update](/files/nfbZreACSxIX8BBsBSaQ) Setelah di-Update, Kamu bisa klik icon **Preview Changes** untuk melihat hasilnya. ![Preview Changes](/files/ycCJPCn0p3ZUmQoOZdKd) Ini adalah hasil form dari **Contact Form 7** yang tadi sudah dibuat. Kamu bisa langsung **Copy** **URL**-nya. ![Copy Link](/files/sr3kxTZeNNaTaNA7tn3G) 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](/files/oZgxj3DIrloQ4tvcrmgO) 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](/files/nxYcZDV82I0Ybjpip0co) Maka akan muncul plugin **WatZap** pada WordPress Kamu. Kamu bisa langsung masuk ke menu **Custom Form** pada plugin **WatZap**. ![Pilih Custom Form](/files/6Jn9BJowyFhZ5xpeLBzr) Lalu klik tombol “**+ Add New Form**“. ![Klik Add New Form](/files/3py6lJlAmAtc31mqU8kY) Nah, pada bagian **Integration**, Kamu pilih yang **Contact Form 7**. Kemudian klik **Next**. ![Pilih Contact Form 7](/files/S1ppC1nbKPRnNBJgsR1O) Pada bagian ini, Paste **URL Form** yang tadi sudah Kamu Copy. Lalu klik icon **Search**. ![Masukkan URL Form](/files/G9wJ2GU8QIEntDHkofsK) 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](/files/c6hNtUP1HMrTSfahkjQE) Kamu juga bisa mengatur untuk menambahkan **Country** **Code** pada Form atau **Redirect** ke halaman lain setelah user mengisi form. ![Atur Country Code](/files/sG7XBbp2RUHl8IfqCMpV) 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](/files/4jrqClkwZNbaNGoDPhFT) Lalu masukkan isi pesan notifikasi yang akan diterima, dan jangan lupa masukkan nomor Kamu. Jika sudah, klik tombol **Next**. ![Isi Pesan Admin](/files/BofZ1ne8aswbyvX0HCpu) Jika sudah muncul notifikasi seperti ini, itu tandanya Kamu sudah berhasil mengintegrasikan Contact Form 7 ke WatZap. ![Berhasil Integrasi](/files/RtaqTUkOnAQff3KQSS2F) --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.watzap.id/help/integrations/integrasi-dengan-contact-form-7.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.