Contact Form 7 Send to WhatsApp

  • Version 0.11.2
  • Download 615
  • File Size 171KB
  • Create Date 16 March 2020

Update versi 0.11.2 (28/07/2020)

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

Cek detail perubahan pada halaman Github CF7-Send-WA

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

---

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 WhatsApp untuk pesan yang akan dikirm ke nomor whatsapp. Jika Anda pengguna versi sebelumnya, template pada tab Mail masih dapat digunakan. Pengaturan pada tab WhatsApp akan menimpa/me-replace pengaturan template pada tab Mail.

Integrasi dengan WhatsApp API Gateway

Plugin ini telah terintegrasi dengan layanan-layanan berikut :

  1. Twilio, Silahkan ikuti tutorial disini
  2. Fonnte
  3. WABlas
  4. RuangWA

Untuk layanan selain Twilio diatas, Anda perlu menghubungkan/pairing device Anda ke server mereka (seperti menggunakan web WhatsApp).

Untuk integrasi ke pihak ketiga lainnya, dapat melalui hook cf7sendwa_custom_send_api, seperti pada contoh ini.

 

AutoRespond

Fitur autorespond hanya bekerja jika Anda menggunakan API pihak ketiga. Beri tanda centang pada opsi WhatsApp Autorespond, kemudian atur nomor WA dan template pesannya.

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" ]

Intergrasi dengan WooCommerce

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

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

*Perhatian, sejak versi 0.10.4, [woo-orderdetail] sudah ditambahkan garis sebelum dan sesudahnya, sehingga tidak peru menambahkan garis seperti pada gambar diatas.

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
  • woo_checkout_order_note

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.

Quick Shop

Anda dapat menampilkan list produk pada contact form dengan menambahkan shortcode [cf7sendwa-quickshop] dan [cf7sendwa-checkout]

Untuk penggunaan shortcode lainnya cek disini.

Cek demo untuk WooCommerce : https://bisnisdemo.solusipress.com/quick-shop/

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
74 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
fariz saputra
fariz saputra
4 months ago

mantap pak.. saya ijin sedot ya.. terimakasih

Fajar
Fajar
3 months ago

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

Samuel Andy Santoso
Samuel Andy Santoso
3 months 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
3 months ago
Reply to  Yerie Piscesa

comment image

Yerie Piscesa
Yerie Piscesa
3 months ago

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

Domain Premium
Domain Premium
3 months 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
3 months ago

Terima kasih. Izin download ya mas.

Lepiza Digital
Lepiza Digital
3 months ago

Izin sedot gan, terima kasih.

rendynata
rendynata
3 months 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
3 months 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
3 months ago
Reply to  Yerie Piscesa

WP(ver 5.4)
Versi PHP: 7.3.6

rendynata
rendynata
3 months ago
Reply to  Yerie Piscesa

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

rendynata
rendynata
3 months ago
Reply to  Yerie Piscesa

ya gpp, terimaksih

Yusuf
Yusuf
3 months ago

shortcode ini tidak daapat diproses [cf7sendwa_woo_checkout] tampilnya tetap shortcode

Yusuf
Yusuf
3 months ago
Reply to  Yusuf

sudah oke setelah update...

Rozaq
Rozaq
3 months ago

Makasih om. Ijin download

Hafizah
Hafizah
2 months 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
2 months 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
2 months 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

Hafizah
Hafizah
1 month ago
Reply to  Yerie Piscesa

Kak.. aku barusan udh udgrade dan coba pakai yg fonnte.. tapi notif nya ga muncul kak.. itu salah dimana yah? Nomor hp nya harus nomor fonnte atau nomor yg kita daftarkan do fonnte?

Terima kasih kak..

uli
uli
2 months 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
2 months 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
2 months 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
2 months 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

uli
uli
1 month ago
Reply to  Yerie Piscesa

halo mas mau tnya lagi klw contact form saya tambah adds on biar tersimpan di database langsung kira kira bakal bermasalah gak yah ke cf7-send-wa

Sakidi
Sakidi
2 months 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.

Sakidi
Sakidi
1 month ago
Reply to  Yerie Piscesa

Mas Terimakasih updatenya, Sangat sangat bermanfaat.

Ach Syafii
Ach Syafii
1 month ago

Setelah klik tombol submit muncul error seperti ini :
Β 
{"code":"rest_no_route","message":"No route was found matching the URL and request method","data":{"status":404}}
Β 
itu kenapa ya kak?

Ach Syafii
Ach Syafii
1 month ago
Reply to  Yerie Piscesa

oke kak, saya coba ikuti step di atas. Terima kasih banyak kak..

Ardi
Ardi
1 month ago

Om, klo di coba di firefox kok loading terus ya,, ?

Amim
Amim
1 month ago

Apakah bisa menambahkan input gambar lalu dikirim ke WhatsApp orang yang dituju, bisa kah?

Abdullah
Abdullah
1 month ago

Waaahh, ini super keren nih

adhitya yuristyawan
adhitya yuristyawan
28 days ago

pak saya kok ga muncul direct ke whatsapp ya? setiap test input form cuma muncul report Thank you for your message. It has been sent.

Ach Syafii
Ach Syafii
22 days ago
Reply to  Yerie Piscesa

Saya barusan update ke versi terbaru mas, versi 0.10.13 juga mengalami hal yg sama, statusnya berhasil tapi tidak muncul redirect ke WA. Butuh settingan tambahan kah? πŸ™πŸ»

Ach Syafii
Ach Syafii
21 days ago
Reply to  Yerie Piscesa

maaf, keburu kepencet post comment. hehehe..
note nya:
Barusan saya ikutin saran dari mas, hasilnya tidak ada error di tab console, pada status popup sudah pada kondisi "allow". Popup chat WA-nya tetap tidak muncul mas.. πŸ™ πŸ™

Ach Syafii
Ach Syafii
20 days ago
Reply to  Yerie Piscesa

Oke, saya coba dulu mas.. πŸ™πŸ»

terima kasih.

Budhi Mulyono
Budhi Mulyono
26 days ago

Saya baru daftar RuangWA, sudah connect device dan pasang token di plugins, seluruh setting juga sudah disesuaikan, tapi masih belum berhasil. Padahal jika langsung mengirim dan menerima pesan WA di RuangWA sudah lancar.
Mohon bantuannya, terima kasih.

Budhi Mulyono
Budhi Mulyono
25 days ago
Reply to  Yerie Piscesa

Sudah saya update tapi tetap tidak bisa, tombol send nya pun tidak berubah menjadi Send To Whatsapp, masih tetap tombol send original CF7. Saya sudah coba membuat form baru, tapi tetap tidak berhasil.
Mohon pencerahan, terima kasih.

reza
reza
22 days ago

mau tanya mas, mengenai pengaturan di woo.
apakah bisa field yg di create dari CF7 hasilnya masuk juga di kolom Biling/Penagihan pada detail Order Woo?comment image

Last edited 22 days ago by reza
reza
reza
22 days ago
Reply to  Yerie Piscesa

maaf mas saya agak awam, masukkannya dimananya ya mas?

Made
Made
20 days ago

Dear Mas Yerie
Klo pake untuk checkout, alamat jadinya tidak ke capture ya di database order woocomerncenya, apakah ada settingannya mas..

Pluginnya mantap deh btw

thanks

Ahmad Budairi
Ahmad Budairi
19 days ago

Saya install Versi 0.10.14Β  ada 3 error, gan:

Notice: Undefined index: resendlabel in /dir/wp-content/plugins/cf7-send-wa/admin/partials/cf7-send-wa-form-settings.php on line 72

Undefined index: allowresend in /dir/wp-content/plugins/cf7-send-wa/admin/partials/cf7-send-wa-form-settings.php on line 61

Notice: Undefined index: allowresend in /dir/wp-content/plugins/cf7-send-wa/public/class-cf7-send-wa-public.php on line 255

envelope-otagscalendarsuitcasewhatsapp
74
0
Would love your thoughts, please comment.x
()
x