Contact Form 7 Send to WhatsApp

  • Version 0.8.2
  • Download 292
  • File Size 88KB
  • Create Date 16 March 2020

Update versi 0.8.2 (03/06/2020)

Untuk update plugin silahkan deactivate versi sebelumnya, delete, kemudian install dengan versi terbaru & activate.

Cek detail perubahan pada : https://github.com/yeriepiscesa/cf7-send-wa

---

Pastikan plugin Contact Form 7 sudah terinstall dan aktif dalam website WordPress Anda. Install dan aktifkan plugin, buka menu Contact -> WhatsApp Send.

Buat form kontak seperti biasa, perhatikan shortcode yang dihasilkan menggunakan akhiran -wa, Anda perlu menambahkan akhiran -wa pada kontak form yang pernah ditampilkan sebelumnya. Jika ingin menggunakan nomor yang berbeda dari pengaturan tambahkan atribut number misal:

[ contact-form-7-wa id="1234" number="628123456788" ]

Atur template pada tab Mail untuk pesan yang akan dikirm ke email dan whatsapp.

Cek demo disini: https://bisnisdemo.solusipress.com/contact-form-7-to-wa-test/

Modal Popup

Untuk menampilkan form dalam bentuk popup modal, Anda dapat mengatur atribut pada shortcode sebagai berikut:

[ contact-form-7-wa id="1234" popup="button" buttontext="Klik untuk membuka form" ]

Atribut popup dapat berisi "button" atau "auto", jika memilih auto Anda dapat mengatur delay (dalam detik) untuk menampilkan form, default 2 detik. Contoh:

[ contact-form-7-wa id="1234" popup="auto" popupdelay="5 ]

Gunakan atribut modalwidth untuk mengatur lebar (dalam pixel) popup modal, contoh:

[ contact-form-7-wa id="1234" popup="auto" popupdelay="5" modalwidth="600" ]

Integrasi dengan Twilio

Silahkan ikuti tutorial disini

Untuk integrasi ke pihak ketiga lainnya, dapat melalui hook cf7sendwa_custom_send_api, seperti pada contoh berikut:

Intergrasi dengan WooCommerce

Buat Form dengan menambahkan shortcode [cf7sendwa_woo_checkout] pada tab Form untuk menampilkan review order.

Tambahkan shortcode [woo-orderdetail] pada tab mail untuk menampilkan detail order pada kiriman WhatsApp.

Pada tab Additional Settings, Anda dapat me-mapping field-field WooCommerce dengan field pada contact form. Field mapping yang tersedia :

  • woo_checkout_first_name
  • woo_checkout_last_name
  • woo_checkout_email
  • woo_checkout_phone
  • woo_checkout_address

Buka pengaturan Contact -> WhatsApp Send, pilih contact form yang sudah dibuat sebelumnya pada pilihan Checkout Form.

Mengaktifkan opsi "Full Width Cart Totals" akan menampilkan box cart totals menjadi full width seperti pada gambar dibawah.

Cek demo untuk WooCommerce : https://bisnisdemo.solusipress.com/cart/

Perhatian: Plugin ini masih dalam versi Beta, harap laporkan jika terdapat error atau bugs melalui kolom komentar.

Saran pengembangan dan Pertanyaan silahkan tulis pada komentar untuk memulai diskusi.

0 0 vote
Article Rating
Subscribe
Notify of
guest
39 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
fariz saputra
fariz saputra
2 months ago

mantap pak.. saya ijin sedot ya.. terimakasih

Fajar
Fajar
1 month ago

untuk gravityforms juga donk mas tutornya? code snippet tsb di pasang di theme function.php bisa?

Samuel Andy Santoso
Samuel Andy Santoso
1 month ago

Saya coba ga pake beberapa field sama ubah labelnya tapi kok jadinya kaya gini ya?

From: Nama Anda Subject: [your-subject] Message Body: Ini pesan Anda -- This e-mail was sent from a contact form on domain.com (https://domain.com)

Samuel Andy Santoso
Samuel Andy Santoso
1 month ago
Reply to  Yerie Piscesa

comment image

Yerie Piscesa
Yerie Piscesa
1 month ago

Saya coba dengan setting yg sama ngga ada masalah sih. Coba [your-name] dihapus dulu, ketik ulang, save.

Domain Premium
Domain Premium
1 month ago

klo untuk menambahkan harga ( dalam numeric ), dan tambahan pilihan varian yang secara otomatis harga awal bertambah jika memilih varian yang lain

mohon solusinya om, saya mau belajar

Alfabetis
Alfabetis
1 month ago

Terima kasih. Izin download ya mas.

Lepiza Digital
Lepiza Digital
1 month ago

Izin sedot gan, terima kasih.

rendynata
rendynata
1 month ago

mau tanya,setelah saya isi form semua kemudian saya simpan terus direload hilang semua yang telah saya isi, apakah memang begitu atau bug ?

rendynata
rendynata
1 month ago
Reply to  Yerie Piscesa

comment image maksut saya yang ini, setelah saya isi kemudian saya simpan setelah saya refresh kemudian isian formnya hilang, maaf kalau saya tanyanya kurang jelas

rendynata
rendynata
1 month ago
Reply to  Yerie Piscesa

WP(ver 5.4)
Versi PHP: 7.3.6

rendynata
rendynata
1 month ago
Reply to  Yerie Piscesa

setelah saya check ternyata memang conflict dengan plugin Ultimate Addons for Elementor

rendynata
rendynata
1 month ago
Reply to  Yerie Piscesa

ya gpp, terimaksih

Yusuf
Yusuf
1 month ago

shortcode ini tidak daapat diproses [cf7sendwa_woo_checkout] tampilnya tetap shortcode

Yusuf
Yusuf
1 month ago
Reply to  Yusuf

sudah oke setelah update...

Rozaq
Rozaq
1 month ago

Makasih om. Ijin download

Hafizah
Hafizah
25 days ago

Kak.. udah di coba.. dia work.. tapi di history pemesanan nya dia ga muncul yah kak? Cuma sampai thank you page saja yah kak?

Dan bisa ga kak kalau ku tambahin field metode pembayarannya yg dari woocommerce nya kak?

Terima kasih kak...

Hafizah
Hafizah
25 days ago
Reply to  Yerie Piscesa

Okee baik kak.. terima kasih banyak yah kak.. oh iya mau tanya lagi.. tadi coba pakai yg twilio whatsapp kak.. terkirim.. tapi ga ada whatsapp masuk dari twilionya kak untuk notifikasi form nya... sebelumnya udah coba sandbox di twilio kak..

Itu kira2 gimana yah kak?

Hafizah
Hafizah
9 days ago
Reply to  Yerie Piscesa

Mas.. untuk interegasi dengan pihak ke 3 itu.. saya masukin code di snippet nya yg di contoh mas nya dan ganti api key dan number nya aja... atau yg dari kode doc api penyedia nya mas? Saya masih kurang paham yg ini..hhee

uli
uli
20 days ago

Hallo mas saya mau tanya , saya coba integrasi dengan Woocommerce Checkout tapi saat tekan tombol pesan sekarang kenapa gak mengarah ke Whatshap hanya tulis pesan telah dikirim saja, harusnya mengarah ke WA dengan sendirinya yah, sedang di form tanpa ada integrasi ke Woocommers saat saya isi otomatis mengarah ke WhatsApp untuk kita send manual

uli
uli
19 days ago
Reply to  Yerie Piscesa

oh sudah bisa mas, cuma pas saya pake notif "Pesanan telah kami terima, silahkan cek [cf7sendwa-received-link title="detail pesanan"] atau lakukan [cf7sendwa-payment-link title="pembayaran"]" untuk detial pesanan bila diklik saat di form checkout pake cf7 send wa malah balik lagi ke form checkout cf7 tapi saat pake bawaan woocommers pesanan yg mengarah ke order pay berhasil begitu juga payment linknya, kira-kira kenapa yah?

uli
uli
19 days ago
Reply to  Yerie Piscesa

hasil linknya untuk detial mengarah lagi ke form checkout cf7 bukan ke order recevied, padalah cek dilink hasil link diatas sudh seperti ini https://bisnisdemo.solusipress.com/checkout/order-received/422/?key=wc_order_Sa1G3JZgCSOgk cuma yg muncul form checkout bukan order received, begitu juga pembayaran, tpi klw saya gak pake cf7 pake checkout bawaan woocommerce saat pilih order-receive dia muncul

uli
uli
19 days ago
Reply to  uli

sudah solved mas,
ternyata karena saya ngerubah form checkout yg di pengaturan lanjut ke checkout jadi link tidak terbaca ke arah order received dan pay for order

Sakidi
Sakidi
18 days ago

terimakasih untuk update integrasi dengan layanan pihak ketiga selain twilionya mas.
tapi saya belum faham mengenai cf7sendwa_custom_send_api,
setting / penempatan code nya dimana?
saya ingin mencoba integrasikan dengan layanan wabot.
dimana saya menempatkan dokumentasi API nya?
Terimakasih.

envelope-otagscalendarexternal-linksuitcasewhatsapp
39
0
Would love your thoughts, please comment.x
()
x