Create a WhatsApp Widget on Website
Learn how to create WhatsApp chat widgets on your website using DoubleTick. Enable real-time communication between website visitors and businesses.
Checkout our video on; How to create a WhatsApp Widget for Website? 👇
Create New WhatsApp Widget
To create a WhatsApp widget,
Go to settings, navigate to "WhatsApp Widget," and click on it
The WhatsApp widget panel will open
To create a new widget, click on the "Create New Widget" button located at the top right corner
The setup WhatsApp widget page will appear
This panel allows you to customize your own widget with the following options:
| Description | Example | |
|---|---|---|
Widget Name | The name you will save your widget within the system |
|
Colours | You can customize the look of the widget. You can adjust the color for the chat button, chat button text, input box, input box text, text color, and background color according to your preference |
|
Business Name | Enter the name of your business. Business Name is displayed to customers. |
|
Message Placeholder | You can write the message that will serve as a placeholder in the input box, guiding customers on what to enter |
|
Chat button title | The title that will be displayed on the chat button, indicating its purpose to users |
|
Default message | This is the message that will be pre-filled in the chat window when customers initiate a conversation |
|
Auto open delay (in seconds) | This refers to the amount of time the widget waits before automatically opening after the webpage loads, specified in seconds |
|
Enable tracking code | This option allows you to activate tracking functionality within the widget |
|
Position on page | This setting determines where the widget will be displayed on the webpage, allowing you to specify its location for optimal visibility and accessibility |
|
Preview | This option allows you to preview how the widget will appear and function on your webpage before saving the changes |
|
After entering all the details, click on the "Save Widget" button to save your widget settings
A widget code will be generated, which you need to copy and implement on your website.
You can share this code with your web developer for implementation.
In the code, you need to enter the company logo URL, which will serve as the link for the logo image
companyLogoUrl: "https://imgur.com/a/HGVPNrH",
If you have integrated with Shopify, you can add a widget to Shopify by simply clicking on the "Installed to Shopify" button
You can create multiple chat widgets
Last updated