You can now get your customers to reach out to you easily by adding a responsive WhatsApp chat widget to your website.‍
In this module, we’ll show you how you can add a customized chat widget to your website.

What Is A Chat Widget?


widget to your1


 The chat icon that you see on the left panel of Interakt’s inbox is the widget creator. This is where you need to head to create a chat widget and install it on your website.


widget to your2


 Interakt allows you to embed a chat widget as a pop-up on your website. This chat widget will redirect users to a WhatsApp messenger window allowing them to have a conversation with your team in real-time.

By installing a chat widget on your website, you will be creating an easy communication channel for your users, allowing them to reach out to you instantly while they are on your website.‍

How To Style A Chat Widget?


widget to your3


 Interakt lets you style and customize the chat widget to suit your band image. In this dashboard here, you can style your chat widget as per your brand’s colors, pick custom images, write catchy welcome messages and decide where to position it on your website.


widget to your4


 You get to opt for the type of button that you want to use, you can either go for a simple button with just the WhatsApp logo or you can add text to the button.


widget to your5


• Next, you get to define the color of the button – you have a few default options here. You can even choose to pick the exact color code by adding the Hex color code, as shown in the above image.


widget to your6


• You can further add an image to the chat widget. You have the option to choose from a range of industry-related images.


widget to your7


• You can then move on to add a customized welcome message for your users. You have the option to add a greeting and a short into message.


widget to your8


• Next, you get to decide where you want to position your chat widget – you can get to see the preview as on desktop or mobile right below.

You also get to choose the launcher position and the spacing of your chat widget for both desktop and mobile versions of your website.


widget to your9


• In the last step here, you can configure the WhatsApp number to the chat widget – so anytime a user messages you, you will receive the message on the number you give here. Along with this, you can add a default text message here.


widget to your10


• As shown in the above image, if the preview that appears on your screen looks good, you can go ahead and click on ‘Save Changes’.

How Can You Install A Chat Widget On Your Website


widget to your11


• To install the chat widget, you need to head to the ‘Install’ tab on the left-hand side.
As you can see, you have three options here to add the chat widget to your website. You can simply copy and paste this code to your website. We will soon be rolling out options to add it with Shopify and WordPress sites as well.


widget to your12


• You have the option to either choose the Javascript code or the HTML code. You can then copy the code and simply paste it to your website to install the chat widget.