Quick Guide: Adding a WhatsApp Chat Widget to your Website

Enhancing customer support on your website is essential for engaging visitors and increasing conversions. By incorporating a floating WhatsApp website widget, you can facilitate real-time communication and seamless interaction. This quick guide will walk you through the simple steps to add a floating WhatsApp Chat button to your site, enhancing user experience and boosting customer engagement.

How To Create a WhatsApp website widget

1. Go to Clickiny App and Create an account.

Clickiny signup for WhatsApp Chat Widget

2. Once you login, click on the “Create New” button on the dashboard

Clickiny - create WhatsApp Chat button

3. In the Editor, you’ll have different customization options, which we’ll touch on below.

In the “Button” section you can change the position, label and feel of the button.

  • Change the position on Desktop and Mobile
  • Change the label text, color, type
  • Change the button Icon, shape and colors.

4. On the Widget section, you’ll see two tabs – Design and Agents.

At this stage of the customization you can click on the button to expand the widget.

5. Under the “Business Details” tab, edit your business name, phone number for the chat, and the welcome message the user will see when they open the widget.

6. The “Chatbox Style” tab allows you to customize:

  • Add your brand logo for the chat box
  • Brand color widget
  • Widget title and description

7. In the scenario where you have multiple agents to handle support, you can add agents by going to the “Agents” tab under “Widget” section and click the “Add New Agent” button to add an agent.

Customize the details of the agent: agent image, name, role and phone number. You can also add the availability of the agent.

NOTE: the display of the widget will change when you start adding agents.

8. Click on “save” and then “publish.”

NOTE: Always make sure you click “save” after making edits to your WhatsApp Chat Widget.

9. Copy the resulting HTML code.

Embedding the Floating WhatsApp Chat Widget to your Site

We offer several comprehensive guides to help you add a WhatsApp website widget to your site, whether you’re using popular website builders or implementing it through HTML. These step-by-step tutorials are designed to make the integration process simple and seamless

How to add floating Whatsapp button to WordPress website

How to add floating Whatsapp button to Wix website

How to add floating Whatsapp button to Squarespace website

How to add Whatsapp floating button to Leadpages website

How to add floating Whatsapp button to Framer website

How to add floating Whatsapp button to Weebly website

How to add floating Whatsapp button to Instapages website

How to add floating Whatsapp button to Carrd website

How to add floating Whatsapp button to Webflow website

How to add floating Whatsapp button to Clickfunnels website

How to add floating Whatsapp button to Ghost website

How to add floating Whatsapp button to Unbounce website

Facebook
Twitter
WhatsApp
Email

Leave a Reply