Add Floating Whatsapp Message Button on Your Website:-
If you want to add quick whatsapp floating button with message box to connect with your users then here I am going to share an awesome jQuery plugin which add floating whatsapp button on your website and if some one click on that button a chat box will open with prefilled message, Using this quick connect box your user can send message to you on given whatsapp number using whatsapp web api.
Add Floating Whatsapp Message Button on Your Website
Libraries
Include following JS+CSS libraries on page to enable floating Whatsapp message button on your website,
<!--CSS--> <link rel="stylesheet" href="floating-wpp.min.css"> <!--JS--> <script src="//code.jquery.com/jquery-latest.min.js"></script> <script type="text/javascript" src="floating-wpp.min.js"></script>
HTML
Create a div container where whatsapp floating button and message box will display on page.
<div class="floating-wpp"></div>
JS
Finally call the plugin’s function on page and customize the options like messagebox title, predefined message, floating button position etc.
$(function () {
$('.floating-wpp').floatingWhatsApp({
phone: '99999999999',
popupMessage: 'Welcome to iamrohit.in',
showPopup: true,
position: 'right', // left or right
autoOpen: false, // true or false
//autoOpenTimer: 4000,
message: 'Hello how are you my name is rohit',
//headerColor: 'orange', // enable to change msg box color
headerTitle: 'Whatsapp Message Box',
});
});
See live demo and download source code.
DOWNLOAD
Visit official github repository for more information and follow for future updates. Don’t forget to read license for using this plugin in your projects.
