Is it possible to send a contact form's input data from my Wix site to my WhatsApp directly?

Ask the community
,
1

Hey, currently when a visitor submits a form, we can have it forwarded to an email. Which works fine but I’m trying have the same contact form data sent to my whatsapp number when they hit submit.

Has anyone figured it out or does anyone know how to achieve this? Please let me know.

Thank you in advance.

2

I think this could be possible.

3

Hi, can you please provide a sample code. The only work around I can think of is using the Whatsapp link generator.

For example, this is how the Whatsapp link generator with a pre-written text looks like. The ‘XXXXXXXXXXX’ would represent the destination contact number.

https://api.whatsapp.com/send?phone=XXXXXXXXXXXX&text=Hi%2C%20this%20is%20a%20test%20message!

My goal is for the code to fetch the form data input by the user and use it to create the ‘text’ part of the Whatsapp link and send the user to that new link.

Please help me with the code structure if possible.

Thank you in advance.

4

HI, so I have read all the related articles. I even found similar codes but unfortunately, nothing happens on click.

I’m new to Wix Code and don’t have a coding background.

I’m running tests on this link >> www.josesibik.com/test

This is the code I came up with till now. It is a modified version of Vorbly’s code here . I tried the original code and nothing happened as well.

import wixLocation from 'wix-location';

export function testbtn42_click(event) {

let text1 = $w("#input7").value;

let text2 = text1.replace(/\s/g, "%20");

let link = "https://wa.me/XXXXXXXXXXXX?text=" + text2;

wixLocation.to (link) 

}

Please help and let me know what I’m doing wrong.

Thank you in advance.

Regards,
Jose

5

@jose-kizhakedathu

Perhaps you can get some useful informations out of this post here…
https://www.wix.com/velo/forum/coding-with-velo/dynamic-link-not-taking-inputs/p-1/dl-605ed8e33f105701152f3f7c-605ec9ba6e3a0401153d4dc6-1

6

Hi everyone, due to my lack of basic coding knowledge, I ended up trying and testing the bits of code I found from various articles and piecing them together.

The custom contact form for the following code looks like this (for reference),

The code I finally had working for my use case is mentioned below.

You can find a set-by-step explanation to add this code here .

import wixLocation from 'wix-location';

export function testbtn42_click(event) {

let text1 = "First Name:" + $w("#input7").value + "______";

let text3 = "Last Name:" + $w("#input8").value + "______";

let text5 = "Email:" + $w("#input9").value + "______";

let text7 = "Phone:" + $w("#input10").value + "______";

let text9 = "Message:" + $w("#input11").value;
let text10 = text9.replace(/\s/g, "%20");


let link = "https://wa.me/XXXXXXXXXXXX?text=" + text1 + text3 + text5 + text7 + text10;

wixLocation.to (link) 

}

I have temporarily hosted the example on this link so you can try it out and see the outcome.

The only catch is that for some reason Whatsapp doesn’t allow ‘line breaks’ even if you have it encoded. So to make it somewhat organized, I added ‘______’ after each part.

Hope this helps someone else who is new to code and wants to achieve this feature.

If you have any suggestions to improve the code or find any errors, please let me know. Thank you.

7

You generated your own solution. Well done!