Install the web messenger on your website

The web messenger is the chat window on your website. Visitors chat or call you from it, and their conversations arrive in your inbox.

Before you start

Every planNeeds: General: Write

• You can edit your website’s code, or someone who can is helping you.

1. Allow your website’s domain

The web messenger only loads on domains you allow. Until you add one, it doesn’t appear anywhere.

1. Go to Settings›Workspace›General.

2. Under Allowed widget domains, type your domain, such as example.com, and click Add domain.

   • *.example.com allows example.com and every subdomain, such as shop.example.com.
   • To test on your own computer, add localhost or 127.0.0.1.
   • Leave out https://, page paths and port numbers.

3. Add any other domains, up to 20.

4. Click Save changes.

2. Add the code to your website

1. Go to Settings›Channels›Web Messenger and stay on the Overview tab.

2. In the Installation card, click Copy to clipboard next to the code.

   If you have more than one widget key, first choose one under Install with key. Use a separate key for each website, or for your test and live sites. See Manage widget keys.

3. Paste the code into every page of your website, just before the closing </body> tag. Most website builders have a place for code that goes on every page.

4. Publish your website.

The code looks like this, with your own key in place of nd_xxxxxxxx:

<script src="https://cdn.prativani.com/widget.js"></script>
<script>
  new SupportWidget({
    widgetKey: 'nd_xxxxxxxx',
  });
</script>

3. Check it works

1. Open your website in a new browser window.

   You should see the chat button in the bottom corner of the page.

2. Click it and send a test message.

3. In Prativani, open your Inbox.

   You should see your test message as a new conversation.

On the Widget keys tab, your key now shows when it was last used.

What happens next

• Customize the web messenger to match your brand.
• Choose which AI agent answers website chats.

Common problems

The chat button doesn’t appear

Check that the domain in your browser’s address bar is on your Allowed widget domains list, and that you clicked Save changes. Then check that the code is on the page and your website was published. If the key is marked Inactive on the Widget keys tab, activate it.

Visitors see “This widget is not authorized for this domain.”

The page is on a domain you haven’t allowed. Add it under Allowed widget domains. Remember that www.example.com needs either its own entry or *.example.com.

My changes don’t show on the website

Visitors’ browsers keep the web messenger’s settings for up to five minutes. Reload the page after a few minutes.