Web link to specific whatsapp contact - html

I'd like to place a link on a webpage which opens a whatsapp chat with a certain whatsapp contact. In other words: I want a "contact me by whatsapp" link to go next to the page's "Contact us my facebook/twitter/google+/etc" links. Something like:
href="whatsapp:contact=015555555555#s.whatsapp.com&message="I'd like to chat with you"

********* UPDATE ADDED AT THE END *********
I've tried many approaches and I have a winner (see Test 3), here is the result of each one:
(I think the Test 3 will also work for you because if the person visiting your site doesn't have you on their contact list, it's the only option that will allow it.)
In all tests, the number had to be complete, with country and location code without any initial zeros. Example:
+55(011) 99999-9999 (NOT)
+5511999999999 (YES)
On tests 1 and 2, it only worked with a plus sign on the country code: +5511999999999
Test 1:
Send Message
This way you must have the phonenumber on your contact list. It doesn't work for me because I wanted to be able to send a message to a number which I may not have on my contact list.
If you don't have the number on your contact list, it opens the Whatsapp listing all your registered contacts, so you can choose one.
It's a good option for sharing stuff.
Test 2:
Send Message
This approach only works on Android AND if you have the number on your contact list. If you don't have it, Android opens your SMS app, so you can invite the contact to use Whatsapp.
Test 3 (The Winner):
Send Message
This was the only way that worked fully for me.
It works on Android, iOS and Web app on the desktop,
You can start a conversation with a number that you don't have on your contact list
You can create a link with one pre-built message adding &text=[message-url-encoded] like:
https://api.whatsapp.com/send?phone=15551234567&text=Send20%a20%quote
And if you wish to have a bookmarklet for additional ease of use, you may use this one:
javascript: (function() { var val= prompt("Enter phone number",""); if (val) location="https://api.whatsapp.com/send?phone="+escape('972' + val)+""; })()
Youll need to change the country code(or remove it) to you.r target country and paste it in the address field in a chrome/firefox link
Worth notice:
I had to update my WhatsApp to the latest version
The number's country code must not have a leading plus
More details here: https://www.whatsapp.com/faq/en/general/26000030
***************** UPDATE (START) *****************
Whatsapp made available other option, now you can create one link to a conversation like this:
https://wa.me/[phonenumber]
The phone number should be in international format:
Like this:
https://wa.me/552196312XXXX
NOT like this:
https://wa.me/+55(021)96312-XXXX
And if you want to add one pre-built message to your link, you can add ?text= at the end with the text URL Encoded:
https://wa.me/552196312XXXX?text=[message-url-encoded]
Exemple:
https://wa.me/552196312XXXX?text=Send20%a20%quote
More info here:
https://faq.whatsapp.com/general/chats/how-to-use-click-to-chat
***************** UPDATE (END) *****************

The following link seems to work fine -
Ping me on WhatsApp
It opens the contact in WhatsApp app, along with the message 'Hello World!' prepopulated in the input text box.
(Tested this with google chrome on an android phone.)

Official WhatsApp doc Says-:
https://api.whatsapp.com/send?phone=countrycode+phonenumber
Use: https://api.whatsapp.com/send?phone=15551234567
Don't use: https://api.whatsapp.com/send?phone=+001-(555)1234567
https://faq.whatsapp.com/en/general/26000030

You can use the following URL as per the WhatsApp FAQ:
https://wa.me/PHONENUMBERHERE
Add the country code in front of the number and don't add any plus (+) sign or any dashes (-) or any other characters in the number. Only integrers/numeric values.
You can also predefine a text message to start with:
https://wa.me/PHONENUMBERHERE/?text=urlencodedtext

I've tried this:
whatsapp
changing 'phonenumber' into a specific phonenumber. This doesn't work completely, but when they click on the link it does open whatsapp and if they click on a contact the message is filled in.
If you want to open a specific person in chat you can, but without text filled in.
test
You'll probably have to make a choice between the two.
some links to help you
Sharing link on WhatsApp from mobile website (not application) for Android
https://www.whatsapp.com/faq/nl/android/28000012
Hope this helps
(I tested this with google chrome on an android phone)

You can now use a very simple API https://wa.me/ to perform this task where you can provide a valid whatsapp contact number like 15555555555 ( add country code, remove all '+', '-', brackets, spaces or leading zeros). You can also provide a urlencoded text as a predefined msg which user can send directly or change before sending.
Chat with me link : Contact me by whatsapp
Chat with me link with predefined text : Contact me on whatsapp
Beauty of this wa.me url is you don't need to check user agent as it works on both mobile and desktop (opens web.whatsapp.com)
Source : https://faq.whatsapp.com/en/general/26000030
More details in my answer on a similar question https://stackoverflow.com/a/51854282/2485420

For what its worth, as of this writing (Nov. 29, 2018), the updated API that seems to work on my end is using this link:
https://wa.me/<phone number here>
Note:
Just replace the placeholder <phone number here> with the intended phone number that you want to use INCLUDING the country code, this means I had to add +60 then the rest of the remaining number.
It doesn't work on my end without one (using Android and iOS at least). It doesn't work means an error message that says along the lines of "you don't have this number".
Reference:
https://faq.whatsapp.com/en/general/26000030

I have been struggling with how to do that as well. I managed to find this helpful method
from php variable:
href="https://wa.me/<?php echo esc_attr( $phone ); ?>?text=Hi%27,%20like%20to%20chat%20with%20you"
<?php echo esc_attr( $phone ); ?> for number in the format:
href="https://wa.me/263777300093?text=Hi%27,%20like%20to%20chat%20with%20you"

This approach only works on Android AND if you have the number on your contact list. If you don't have it, Android opens your SMS app, so you can invite the contact to use Whatsapp.
<i class="fa fa-whatsapp"></i>
Google Chrome am targeting a blank window

From the Official Whatsapp FAQ: https://faq.whatsapp.com/en/android/26000030/
WhatsApp's Click to Chat feature allows you to begin a chat with someone without having their phone number saved in your phone's address book. As long as you know this person’s phone number, you can create a link that will allow you to start a chat with them. By clicking the link, a chat with the person automatically opens. Click to Chat works on both your phone and WhatsApp Web.
To create your own link, use https://wa.me/ where the is a full phone number in international format. Omit any zeroes, brackets or dashes when adding the phone number in international format. For a detailed explanation on international numbers, read this article. Please keep in mind that this phone number must have an active account on WhatsApp.
Use: https://wa.me/15551234567
Don't use: https://wa.me/+001-(555)1234567

This answer is useful to them who want click to chat whatsapp in website to redirect web.whatsapp.com with default content or message and in mobile device to open in whatsapp in mobile app with default content to text bar in app.
also add jquery link.
<a target="_blank" title="Contact Us On WhatsApp" href="https://web.whatsapp.com/send?phone=+919581880892&text=Hi, I would like to get more information.." class="whatsapplink hidemobile" style="background-color:#2DC100">
<i class="fa fa-fw fa-whatsapp" style="color:#fff"></i>
<span style="color:#fff">
Contact Us On WhatsApp </span>
</a>
<a target="_blank" title="Contact Us On WhatsApp" href="https://api.whatsapp.com/send?phone=+919581880892&text=Hi,%20I%20would%20like%20to%20get%20more%20information.." class="whatsapplink hideweb" style="background-color:#2DC100">
<i class="fa fa-fw fa-whatsapp" style="color:#fff"></i>
<span style="color:#fff">
Contact Us On WhatsApp </span>
</a>
<script type="text/javascript">
var mobile = (/iphone|ipod|android|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));
if (mobile) {
$('.hidemobile').css('display', 'none'); // OR you can use $('.hidemobile').hide();
}
else
{
$('.hideweb').css('display', 'none'); // OR you can use $('.hideweb').hide();
}
</script>

I tried all combination for swiss numbers on my webpage. Below my results:
Doesn't work for Android and iOS
https://wa.me/0790000000/?text=myText
Works for iOS but doesn't work for Android
https://wa.me/0041790000000/?text=myText
https://wa.me/+41790000000/?text=myText
Works for Android and iOS:
https://wa.me/41790000000/?text=myText
https://wa.me/041790000000/?text=myText
Hope this information helps somebody!

The solution that worked for me is here in PHP:
$android = stripos($_SERVER['HTTP_USER_AGENT'], "android");
$iphone = stripos($_SERVER['HTTP_USER_AGENT'], "iphone");
$ipad = stripos($_SERVER['HTTP_USER_AGENT'], "ipad");
$whatsappNumber = '1234597891';
$whatsappLink = '';
if($android !== false || $ipad !== false || $iphone !== false) {//For mobile
$whatsappLink = ''.$whatsappNumber.'';
} else {//For desktop
$whatsappLink = ''.$whatsappNumber.'';
}

Phone Number will be a country code followed by WhatsApp mobile number without any symbol. Please refer below code.
WhatsApp Now

Related

Whatsapp Click-to-Chat "Couldn't open link" Error Chrome Android/iPhone

I'm using Whatsapp Click-to-chat functionality, without a phone number. It previously worked but with the new Chrome version 76.0.3809.132, both on iOS and Android is not working anymore. On Android, it's showing a Toast with Couldn't open link. Tried contacting Whatsapp Support but no answer as of yet. With the latest update their own documentation example is not working, link to docs. Any suggestions or experiences?
Link example:
<a target="_blank" href="https://wa.me/?text=Villa%20stone%20road%20piece%2015%20meters%20from%20the%20asphalt%20street" title="Share on WhatsApp">
Error picture Imgur: picture
A table with my tested devices and versions on Imgur
If you use https://api.whatsapp.com/send instead of https://wa.me/ you don't need to specify a phone number.
e.g
https://api.whatsapp.com/send?text=Your%20Custom%20Text
It seems that chrome does not accept click to chat without a number specified. Once there's a number in the URL it works just fine.
Unfortunately I did not find a hack to get around it. Neither of this worked:
https://wa.me//?text=Hello%20World
https://wa.me/0/?text=Hello%20World
only if a proper number is specified it will open WhatsApp, but has the recipient already pre selected (the number we provide).
I tested it for a client about 2 weeks ago, when it still worked. So the last update of Chrome (from Aug 26) seems to be the problem...
The best is to use the custom url scheme format. Universal links do not work well with native clients
whatsapp://send/?phone=&text&source&data
It will work without phone number also.
My issue on a recent breaking-change: Universal links stopped working
There was a great blog post about the issue, however it is already outdated and proposes a php specific solution (nevertheless might gives you a good idea, how to think about the problem)
const text = "Hello..."
const phoneNumber = "23400000000000"
Linking.openURL(`whatsapp://send?text=${text}&phone=${phoneNumber}`)
First: Official Whatsapp Sharing Documentation. One of the following URLs is recommended for WEB use...
https://api.whatsapp.com/send?text=YourShareTextHere
https://api.whatsapp.com/send?text=YourShareTextHere&phone=123
And these for MOBILE use...
whatsapp://send?text=YourShareTextHere
whatsapp://send?text=YourShareTextHere&phone=123
If you are interested in watching a project that keeps track of these URLs, then check us out!: https://github.com/bradvin/social-share-urls#whatsapp

Link to chat whatsapp desktop

Is it possible to create link to chat for whatsapp on desktop and specify number
which doesn't exist in contact list?
whatsapp
This implementation works fine for mobile(doesn't matter number exists in your contact list or not), but for desktop in doesn't work if there are no such contact in your contact list and as a result I got a pop-up window with message 'Phone number shared via url is invalid'
yes, this is possible, but you need to :
Specify the text or/and link
For opening contact list, on zap, just set the content as text .
whatsapp://send?text=http://www.yoursite.com
Specify the zapzap telenumber for sending directly to contact .
whatsapp://send?phone=5531920095096&text=http://www.yoursite.com
You can also use the zapzap oficial page. This takes 2 steps :
https://api.whatsapp.com/send?phone=5531920095096&text=Hello
Remember that, all content on text variable must be a encoded string, and also that phone number have no spaces, or characters, also country code have not +
This is a nice feature, works very well. You can use (3) option and create a "goo.gl" url, and for options (1) and (2) you can trigger on a website, or app .
Actually, i'm trying to find some way to make whatsapp:// open in whatsapp desktop instead of asking for choose app from microsoft appstore, because now, its not opening it anymore, i dont know why, this used to work .
By the way, if you are a spammer .. don't even try anything, or we will catch you and all your fake numbers or profiles .
This is not for spamming. You have to use broadcast lists .
You can send the phone number so i can check if its correct, or, if you like, i can show you how this can be used, in our classifieds, included one buton for contact each seller, so users have an omnichannel experience .
Contacting advertisers from our site very fast, instead of saving, refreshing and contacting, can click and open zapzap chat .
If you have a website a customer service phone line, and a zapzap number, you are already a multi-channel business, so this is for seamless cross channel, so users can change from site to zapzap .
Remember that, best soluction for this issue is to use the API Page (3), and that you need to specify text variable all times, because IF you are going to send, you need to send something, and also, there is a "=" character after the phone number variable (at your example) that must be removed .
Please vote this up, because it took a long time to do .
Comment if you have anything to add .
Remember also that this is 2017-2018, and the zap implementation had started some months ago. Please whatsapp, let us opening whatsapp:// protocol from chrome to whatsapp desktop, it was working so nice .. please, it save us so much time, to start a conversation with a number not on contact list, and its working on mobile, just on desktop, that was nice, but since December update, its not running,.. whatsapp pleeeeeeeeeaseeeeee .
UPDATE: As i changed my phone number, i updated the post, because many people arround world contact me saying "thank you" or asking help on something .
Try this:
<body class="" onload="myWhatsappFunction()">
<a id="whatsapp-btn" class="" target="_blank"> Whatsapp</a>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mobile-detect/1.4.3/mobile-detect.min.js"></script>
<script>
var whatsapp_number = YOUR_PHONE_NUMBER_HERE;
function myWhatsappFunction() {
var md = new MobileDetect(window.navigator.userAgent);
if (md.mobile()) {
// mobile link
document.getElementById("whatsapp-btn").href = "https://wa.me/" + whatsapp_number;
} else {
// desktop link
document.getElementById("whatsapp-btn").href = "https://web.whatsapp.com/send?phone=" + whatsapp_number;
}
};
</script>
References:
https://faq.whatsapp.com/en/android/26000030
http://hgoebl.github.io/mobile-detect.js
https://cdnjs.com/libraries/mobile-detect
To create your own link to your whatsapp number with a pre-filled message that will automatically appear in the text field of a Whatsapp WEB-chat, you can use: (Dont work on Firefox web browser)
<a href="https://api.whatsapp.com/send?phone=yourwhatsappnumberwithcountrycode&text=hello"</a>
this API promises work on all browsers check it out:
https://www.forblink.com/
Try to use such link - https://wa.me/"number" where the "number" is a phone number in international format without + or - or dots.
So it must look like that: https://wa.me/89273546633
A possible cause of this error 'Phone number shared via URL is invalid' is that the phone number that you are trying to invoke is not on Whatsapp list, i.e. the number does not receive WhatsApp messages since it might not be registered on WhatsApp. I tried that using several of my phone numbers and the ones not on WhatsApp were throwing this error but those on WhatsApp worked. Guess will save someone from debugging.
I had the same problem in the past week, only links like wa.me/number were working fine on desktop for the past few years.
It seems that WhatsApp’s policy changed. I read advice about updating or accepting the privacy policy "which I don't" but all not correct. I tried different account on new installation and it didn't work.
It does not require the phone to be in your contact list, if you chatted with the number it will work. If there is no previous chat it stopped working a week ago.
A very simple solution. I added my country's area code (+44) in-front of the mobile number.
It works for both mobile and desktop.
Alternate solution
If you have specific numbers to send
You cane upload the numbers on Google contact
Same email I'd needs to be in mobile

href whatsapp link to number

I'm having an issue trying to send Whatsapp messagges through browser using this code:
click
Using this code, Whatsapp opens correctly but the number is not recognized (i'm trying with my number, which is registered in Whatsapp) saying something like "You're trying to reach a non-Whatsapp number. Invite him or send SMS".
My international code (Italy) is +39.
I've tried 003912345, +3912345, 3912345, 12345, but with no success.
Anyone experienced this? Thanks for the help!
You get the message"You're trying to reach a non-Whatsapp number. Invite him or send SMS" because the number you want to use for sending the message to must be present into your phone contact list.
Anyway the attached code you use for the link won't work on iOS.
Try to use: href="whatsapp://send/?text=<>" data-action="share/whatsapp/share" . The link will open WhatsApp but you will have to manually select the consignee of the message from your contact list, otherwise you could use the ABID code to send the message directly to your contact.
Here you'll find more info about this technique: https://www.macstories.net/tutorials/use-whatsapps-url-scheme-with-drafts-launch-center-pro-or-a-bookmarklet/

Dynamic Link Actions in mailchimp

I need to do dynamic link opening based on each of 3 cases. How do I write this into a link ?
Case 1: user is on desktop or Android. Send user to website link with
reference to content example.com/content/123
Case 2: user is on
iOS app is not installed. Send to App Download, post download open
content article that user tapped on
Case 3: user is on iOS app is
installed. Open app with activity link and link to that activity in
the app myapp://content/123
Any ideas how to write this into an HTML source that I can add to email? On click it will have to figure out what it wants to do.
Here is what the source looks like in mailchimp email template per content item:
<span>A brief funny description about this place, in one or two phrases...
Read More
</span>
Any help is greatly appreciated.
You are looking for the concept of deep linking. I can help you with 2 of your cases
First I'll explain how I would attempt to make this work. This sample will open the Facebook app and navigate to the Wikipedia page. You can try this out by opening this link from your Android or iOS device.
Instead of having the direct link in the email itself, I'd use one link that would then, on the server's side, determine the action to take.
In your email template, do this
<span>A brief funny description about this place, in one or two phrases...
Read More
</span>
This should then take the user to a script named 'my_server_script.php' (my example is PHP, but you can achieve this in any language).
In this script, you can then check the User Agent by using PHP's $_SERVER['HTTP_USER_AGENT']. This will give you something like Mozilla/5.0 (Macintosh; U; PPC Mac OS X; en) AppleWebKit/418 (KHTML, like Gecko) Safari/417.9.3. Then by parsing this string, you can determine the user's OS and take an action based on that. Please do note that User Agent strings can be modified and is not always 100%, but it should be more than enough for your use.
Once you have determined the action to take, you could redirect the user to the app by sending them to the deeplink.
Here is PHP code I tested on Android earlier, this should open the Facebook app and take you to the Wikipedia page. As far as I know, it should work on iOS as well.
<?php
// Set App deeplink
$app_url = 'fb://profile/33138223345';
// Try to redirect the device to the URL
header('Location: ' . $app_url);
?>
I don't have a solution for detecting if the app is installed, but if you do find a solution for
that, you should be able to redirect them to the appropriate app store using the code below
<?php
// iTunes link
$app_install_link = 'https://itunes.apple.com/za/app/facebook/id284882215?mt=8';
// Then redirect the user to the app store location
header('Location: ' . $app_install_link);
?>
If you determine they should be sent to the desktop version, simply do
<?php
// Browser link
$link = 'https://example.com/content/123';
header('Location: ' . $link );
?>
This is personally how I would make this work since you won't have the capability in the email itself to check what device you are on and modify the link based on that.
You should however still be able to use the deeplink fb://profile/33138223345 by doing
<span>A brief funny description about this place, in one or two phrases...
Read More
</span>
and that should open the Facebook app on iOS and Android.
Hope this helped a bit!

How to use HTML to do a Skype call?

I tried to insert the following snippet in my script. By clicking the link it should do a call to a Skype account. I've been looking for hours now, but can't figure out why it doesn't work.
<pre><code><a href="callTo://USERNAME"><img src="http://goodies.skype.com/graphics/skypeme_btn_small_green.gif" border=0></a></code></pre>
Is it accepted in any way or do I miss something here?
Try "callto" (with no uppercase letters).
Link will initiate Skype to call my number!
<a href="skype:********?call">Link will initiate Skype
to call my Skype username!</a>
source: http://geek.michaelgrace.org/2010/03/create-html-link-that-starts-a-skype-call/
I have been fighting with the following link all day.
Start chat
The problem that I had was with the USERNAME part
Finally, I just solved it.
My name on Skype web page was name but the real name was name lastname. The link in my web page did make Skype to load in my Android phone but, Skype failed to find the account to wich I wanted to call (name lastname).
I tryed, and failed:
<a href="skype:name lastname?call">...
<a href="skype:name+lastname?call">...
<a href="skype:name%20lastname?call">...
<a href="skype:name-lastname?call">...
<a href="skype:name_lastname?call">...
<a href="skype:phonenumber?call">...
Then, the solution:
<a href="skype:live:emailnamewithoutdomain?call">...
I just hope u find it usefull.
And, do not forget that u have a plenty of commands to add after the ? in the url (add,call,chat,and so on).
Just for another option from their official website:
https://www.skype.com/en/developer/create-contactme-buttons
It's nice and easy to use, can be used both for chat or/and call.