AI-assisted Web Chat Widget Overview

Install a web chat widget on your website that uses an AI assistant to answer questions 24/7 about your business, and capture leads for you and your team to follow up with.

The AI-assist Web Chat Widget comes pre-bundled into Inbox Pro (along with SMS messaging) or can be purchased as a standalone product.

Why is AI-assisted lead capture web chat widget important?

Even if a business is busy, they can benefit from a trustworthy AI assistant working 24/7 on their website to chat with website visitors, capture contact information so the business can follow up later via SMS or email, and turn them into a customer.

AI-assisted web chat is a feature of Inbox Pro product

What does the AI Assistant do?

Once installed on a business website, the chat widget will appear to website visitors and encourage them to chat, with the goal of capturing a lead for the business.

Conversations will appear in Inbox in Business App, where a business person can respond to the lead via SMS, and try to turn them into a customer.

AI Assistant Behavior & Goals

By default, the AI assistant "just works" by responding to any messages from website visitors immediately, while bring a good representative of the business. It has these primary goals:

1. Answer any questions about the business: The AI assistant will respond to questions if it confidently can find the answer in the knowledge it has been trained on (See knowledge training instructions below.) By default, the AI assistant knows basic information about the business from the business profile. It can also be given any additional text knowledge, like answers to FAQs, pricing, products, services, shipping info, or anything in text format. The assistant will not answer questions it does not know the answer to, but instead let the lead know someone from the business will get back to them as soon as possible.

2. Capture the lead's contact info: The AI assistant will engage with a website visitor with a goal to understand their needs, and attempt to get their name and contact info (mobile number, with a fallback to email address) so the conversation can be continued even if the lead leaves the website. Once contact information has been collected, Business App will alert the business that they have a new lead via na email notification.

3. Respond in the language the person is using: The AI assistant can reply in over 40 languages, including English, French, Spanish and many more.

What can I customize?

• Color: It’s possible to customize the color of the chat widget, to match the website it’s installed on. Set a primary color of the widget, as well as the secondary color of the Send button and text bubbles, so the widget can match any business website and brand.

• Web Chat greeting: The message that appears at the top of the web chat widget that website visitors first see, to encourage them to interact with the chat widget.

• AI knowledge: Give your web chat AI assistant additional context and knowledge about the business it’s representing. Learn how to set this up below.

• Profile Information: Add a name and profile photo that will appear to visitors of the website in the web chat.

• Find these options via Business App > Administration > Inbox Settings > Configure Web Chat.

Give your AI assistant business profile knowledge

The AI assistant can be given knowledge about a business from the business profile, to be able to answer questions about what the business does, where it's located, its hours, and how to contact them. This is enabled by default, but can be removed as a knowledge source if desired.
These fields are shared with the AI from the account's business profile:

• Business Name

• Address and/or Service Areas

• Website

• Booking URL

• Phone Number

• Categories

• Hours

• Services Offered

• Short Description

• Long Description

• Social Media URLs

Give your AI assistant additional knowledge from any text source

• Navigate to Business App > Administration > Inbox Settings > Web Chat Settings > AI Assistant.

• Click on any title to see the knowledge that the AI has access to.

• Click Manage Knowledge to go to the centralized area in Business App where new knowledge can be added.

• You can write or paste and text information into a new knowledge source, and then select it to make it accessible to your AI assistant.

• The AI assistant will also show it's source material below the message. 

BOOKING LINK TIP: If the business uses a booking link to let customer book appointments themselves, add the following sentence to the custom knowledge and the AI will encourage visitors to visit the booking link.
"Clients can see availability, pricing and services on our booking link: [linkhere.com]"

• Q: Can the AI assistant scrape websites?
  Yes! You can read more about this here. 

• Q: Can I upload files like PDF or DOC?
  Not yet, only raw text can be saved. Copy and paste important text from your PDF or DOC into the text entry field to make it available to the AI.

• Q: Is this just in Business App?
  This is also available for Partners in Partner Center under Inbox Settings!

How is a user notified about a new lead?

When your AI assistant is successful in capturing a name and contact info, a few things will happen automatically:

1. A new contact is added to the CRM, with the captured info: First name, last name, phone number, and email address.

   • If a user updates their contact info in the AI-assisted web chat (like for example, if they make a mistake), the latest contact info will be updated on the contact automatically.

2. A "New lead" email notification is sent to users of the account, that have the notification enabled (this notification is enabled by default for Business App users.)

How to test Web Chat right now

A fully working AI-assisted web chat is available to test for any account that has Local SEO and Inbox active. Open Local SEO from the desired account, navigate to the My Listing tab > View My Listing. From here, you will see the Web Chat Lead Capture Widget pop up, and you can demo this feature before you install it.

How to enable or disable the web chat in My Listing

The 'Show AI-assisted Web Chat Lead Capture' setting will be turned on by default, but if you need to turn it off, navigate to Partner Center > Administration > Customize > General Product Settings > Local SEO and check off Show AI-assisted Web Chat Lead Capture.

How to install the Inbox Pro Web Chat widget on your website

To install your web chat widget on your website: After Inbox Pro is activated, go to Administration > Inbox Settings > Web Chat Configuration – and set up your web chat widget. After configuring, you can copy and paste your install code into the <head> element of your website, typically just before the closing </head> tag. Feel free to add the chat widget to multiple sites if needed! 

WordPress

OPTION 1: To install on a WordPress site using a plugin

1. Download the web chat widget installation plugin from Administration > Inbox Settings > Web Chat Configuration > Installation.

2. Navigate to your WordPress backend admin, usually at your-website.com/wp-admin

3. Go to Plugins > Add new plugin

4. Upload the zip file containing the plugin you just downloaded.

5. Activate the plugin. Your web chat widget should now appear on every page of your website.

OPTION 2: To install using widget code on a WordPress site with Divi theme:

1. Copy your web chat installation code into your clipboard.

2. Navigate to your WordPress backend admin, usually at your-website.com/wp-admin

3. Go to Divi > Theme Options > Integrations

4. Paste the code into the section titled “Add code to the < head > of your blog.”

5. Save changes. Your web chat widget should now be live on your website, on all pages.

Shopify

1. Copy the web chat widget Javascript code from Business App > Administration > Inbox Settings > Web Chat Configuration

2. Locate your Online Store page on Shopify

3. Click the menu and navigate to “Edit code”

4. Find your “theme.liquid” code file.

5. Locate the closing </head> tag and paste the code above it. Don’t forget to save your code!

6. Congratulations, your Web Chat widget has been installed on your website. Now you can test it.

Other Websites

To install on another website, you'll want to place your web chat widget install code into the header of your site, typically right before the closing < /head >.

Common web chat issues

Issue: I don’t see the web chat on my site, even though it’s installed in the right place
If the Web Chat code is installed on your website and enabled in Inbox Settings, and you cannot see it on your website, the most likely next cause is cache or plugin issues. You can try additional steps on your website to clear cache or any blocking plugins to get the web chat to appear.

Caching issues
Most websites use multiple types of caches that help the site to load faster. You’ll want to reset the caches, to get your latest website changes to appear.

1. Browser cache – to tell your browser to load the website without using local device cache

   • Shift+command+R (Mac)

   • Ctrl + F5 (PC)

2. Website hosting cache – clear the cache that the Website product manages, by clicking the Flush Cache button on the Website overview page

3. Divi CSS cache – Disable the Static CSS File Generation cache in your Divi Theme options > Builder > Advance

4. Other Cache plugins – Ensure there are no other cache plugins activated on your website; if so, disable them.

Google reCAPTCHA badge is in the way

When reCAPTCHA is being used on a website form, this badge will appear in the bottom right of a webpage – which could be in the way of the web chat widget.
You can hide the badge completely on your website with some custom CSS; just make sure to follow Google’s required alternative ways to inform the user that reCAPTCHA is being used. Read more: https://developers.google.com/recaptcha/docs/faq#id-like-to-hide-the-recaptcha-badge.-what-is-allowed

To hide the reCAPTCHA badge, go to your website CSS editor:

1. Log in to your WordPress dashboard

2. Go to Appearance » Customizer

3. Click Additional CSS

4. Add the snippet below:
   .grecaptcha-badge {
   visibility: hidden!important;
   }
   
   

5. Save and preview your website.

I can't type a certain letter or the "Space" key when trying to type in the widget.

Some plugins can interfere with the ability to type in the widget because they “hijack” that key for their own functions.

For example, website admins will have trouble typing messages into the web chat widget when the WordPress jetpack plugin is enabled, because it hijacks some of the keys to open and close their own chat functions. Disabling the JetPack plugin will restore the function of these keys.

Smooth scrolling website features can also interfere with the ability of your website visitors to type the ‘space’ key with the web chat widget. If you have the Divi theme on a WordPress website, you can disable smooth scrolling by going to Divi > Theme Options and disabling the Smooth Scrolling functions.