Whatsapp Floating Chatbox With jQuery Plugin

Floating Whatsapp Chatbox With jQuery
Floating Whatsapp Chatbox With jQuery

whatsapp-chat.js is a small, flexible and customizable Whatsapp chat jQuery plugin that continues to float at the top of the page even when the user scrolls down.

This Plugin allows your visitors to chat with many other Whatsapp users by clicking on the Chat button on your website.

How to use it

1. Insert the stylesheet whatsapp-chat.css and JavaScript whatsapp-chat.js into your document.

<!-- jQuery Is Required -->
<script src="/path/to/cdn/jquery.min.js"></script>

<!-- whatsapp-chat.js Files -->
<script src="/path/to/whatsapp-chat.js"></script>
<link rel="stylesheet" href="/path/to/whatsapp-chat.css" />

2. Create an empty DIV container for the Whatsapp chatbox.

<div id="example"></div>

3. Initialize the plugin and add a contact info to the Whatsapp chatbox.

whatsappchat.singleUser(
{
  selector: '#example',
  name:'DemoCode',
  phone: 'YOUR PHONE NUMBER',
  designation: 'Demo Code Programming',
  image : 'Avatar.jpg'
});

4. You're also allowed to add multiple contacts to the Whatsapp chatbox.

whatsappchat.multipleUser(
  {
    selector: '#example',
    users: [
      {
        name:'DemoCode',
        phone: '8801343434343',
        designation: 'domocode.blogspot.com',
        image : 'https://upload.wikimedia.org/wikipedia/en/d/da/Matt_LeBlanc_as_Joey_Tribbiani.jpg'
      },
      {
        name:'CSSScript',
        phone: '8801343434343',
        designation: 'CSSScript.Com',
        image: 'https://upload.wikimedia.org/wikipedia/en/6/66/Matthew_Perry_as_Chandler_Bing.png'
          
      },
      {
        name:'Vue.js',
        phone: '8801343434343',
        active: false
      },
    ],
    headerMessage: 'Feel free to ask any questions in <strong>WhatsApp</strong>',
    chatBoxMessage: 'Team replies in a minute',
    color: '#25D366',
  }
);

Live Demo

See the Pen Whatsapp Floating Chatbox With jQuery by Teguh Sigit (@teguhsigit) on CodePen.

File Info

File Name :
WhatsappFloatingChatbox.zip
Size :
243.51KB
Site Download :
Mediafire.com
Official Website:
Github.com
License:
MIT
Previous Post Next Post