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

---