Web Chat

Setting up web chat plugin for your website is easy. Just embed the code into the corresponding position to allow your customers to chat with you on their preferred channels, including WhatsApp, Instagram, Facebook, or directly on the chat plugin.


In Setting, you need to fill in Allowed Domains. If your website is https://chatalog.ai, you may fill it in as an allowed domain. Allowed Domains could be more than 1. Setting it up is for preventing other unauthorized websites from embedding your code. Then, you can fill in header and welcome message. Welcome message will prompt upon customers opening conversation window without inputting any message. You can treat that message as a conversation starter. Lastly, input brand name to be displayed and click Save to apply changes.


In Installation, you can select the widget color, the icon image that represents your brand, and the social channels to be shown in the web chat plugin. You can also decide the widget position in the website. Click generate widget code upon finish. Click Copy to get the code. If you can directly edit html of your website, embed it into every enclosing </body> or </head> for all your pages.

Setting up Web Chat on wordpress

If you set up your website with wordpress, we suggest you to embed code before the enclosing </head> with the following plugin.

Before installing the plugin, to protect your website data, please create a backup to prevent plugin incompatibilities. The following configuration is the suggested handling, you may achieve the same with alternatives. If any technical issues occur derived from the plugin itself, we hold no responsibility.

Firstly, go to "Plugins" page and search "Header and Footer Scripts".

After installation, you can find the plugin in Settings > Header and Footer Scripts.

After pasting the code into the field, click Save Settings to apply.

When there are many plugins installed in your wordpress, there might be incompatibility that interferes with your inserted code. We hence suggest you to insert the code into footer and set the priority to 99 to prevent unexpected change of the inserted code.

If you use Elementor as page builder, the change applied to header or footer may not immediately be reflected across all your web pages. In this case, you can go to Elementor > Tools > Regenerate Files & Data.

Then you can view the web chat plugin shown on your website.

If you only need a WhatsApp button on your website instead of our Web Chat widget, you may refer to the following documentation:

Last updated