- With Npm:
npm install whatsapp-sharing
- With Bower:
bower install whatsapp-sharing
- With Git:
git clone https://github.com/kriskbx/whatsapp-sharing.git
- Manually: https://github.com/kriskbx/whatsapp-sharing/releases
Or include the hosted version on jsdelivr: //cdn.jsdelivr.net/whatsapp-sharing/1.3.2/whatsapp-button.js
Use this code right before the </body>
, replace http://your-domain.tld/path/whatsapp-button.js
with the url to the just uploaded file.
<script type="text/javascript"> if(typeof wabtn4fg==="undefined") {wabtn4fg=1;h=document.head||document.getElementsByTagName("head")[0],s=document.createElement("script");s.type="text/javascript";s.src="http://your-domain.tld/path/whatsapp-button.js";h.appendChild(s)}</script>
Place this code somewhere on your website to display the button:
<a href="whatsapp://send" data-text="Take a look at this awesome website:" data-href="" class="wa_btn wa_btn_s" style="display:none">Share</a>
If you want to customize the size, style, url or the sharing text, feel free to visit whatsapp-sharing.com for a code generator.
Run WASHAREBTN.crBtn();
after you loaded your content.
You can simply use JavaScript event handlers like onClick
in the code of step 3.
Nope, that's not possible (at the moment).
It's not possible to check if WhatsApp is installed on the device. This is a good thing, imagine a webpage can access the list of installed applications. And for the record: why should someone try to share something via WhatsApp if he or she is not using WhatsApp at all?
The main reason for this error are modifications of the original button code that prevent the library from selecting the buttons. As a result text and url won't be added and the url-scheme that stays empty. Repeat the installation steps and don't change the code on your own.
You can test that by switching your Browsers useragent to "Android" or "iPhone" and running WASHAREBTN.buttons
in your JavaScript console after that. This should list all the selected buttons on the page.
Well, this library was not made to be heavily modified. It was made to provide an easy way for non-devs to insert a button like this into their websites. If you want your own styling feel free to fork the repo, research the code and build your own button upon it. After all it's only a useragent check and an url-scheme.
MIT