WhatsApp sharing from the mobile browser

November 08, 2015 0 Comments

BuzzFeed Says:

iPhone users are clicking their new WhatsApp button more than Twitter's. This was enough for us to build a WhatsApp sharing button generator, so you can easily create your own.

They have a built a button generator, for you to generate a button for your site and you can just drop a script tag into your site and link with it.



What if you want more control over your button?

How does your mobile browser hand off to the WhatsApp application?

Opening WhatsApp from your browser

Type whatsapp:// into your mobile browser address bar.

It should open the WhatsApp application on your phone.

Sending a text from the browser

In order to send a text here, we want to open directly at the contacts page, to do this type this into the address bar


This should open the app at the contacts page where you can choose a contact to send a message to.

How do you send text content to application?

You can add a text query string to the url which will appear in the input area.


This text needs to be encoded, you can do this with javascript's native encodeURIComponent() function.


All you have to do now is to put it in an a tag, style it and click it on a mobile device.

<a href="whatsapp://send?text=hello%20world!">Send to WhatsApp</a>

To do this dynamically in your website, here's an example using jQuery

See the Pen Whatsapp Share by Andrew McDowell (@madole) on CodePen.

This approach works on both Android and iOS phones with WhatsApp installed.

Have a play with it and leave some feedback in the comments if you have any.