Setting Up and Using the Voice AI Chat Widget
Overview
The Voice AI Chat Widget transforms your website's chat feature by letting visitors have live, two-way voice conversations with your AI assistant. Visitors can speak and listen directly through their web browser's microphone and speakers—no phone call, app download, or phone number is required. This feature is currently available for early access and testing under your account's Labs settings.
What It Does
The widget adds a voice-only mode to your standard chat widget. When a visitor clicks the microphone icon, they start a real-time voice session with your AI agent. During the conversation, visitors can speak naturally, mute or unmute themselves, and end the call at any time. The AI agent responds conversationally based on the Voice AI automations you have configured.
Key Capabilities
- Conduct voice calls directly within a web browser.
- No need for a dedicated phone number or outbound calling.
- Customize the name of your AI agent (e.g., "Support Bot").
- Automatic notice informs users their call is not being recorded.
- Built-in reCAPTCHA helps prevent automated misuse.
- Works with your existing Voice AI actions and workflows.
Enabling the Voice AI Chat Widget
Step 1: Enable from Labs
First, you must activate the feature. Go to Settings > Labs. If you manage multiple accounts, select the desired sub-account tab. Locate the option for Voice AI Chat Widget and toggle it ON. Once enabled, the Voice AI agent type will become available when you configure your chat widgets.
Step 2: Configure the Widget
Navigate to Sites > Chat Widgets. Edit an existing widget or create a new one. Inside the widget builder, go to the Agent Tab. From the agent type dropdown, select Voice AI Agent. In the field that appears, enter a Voice AI Agent Name (this is the name visitors will see). Click Save to store your configuration.
Note: You must have already created at least one Voice AI agent in your account before you can successfully create a voice AI chat widget.
Step 3: Add the Widget to Your Site
In the Chat Widget builder, click the Get Code button. Copy the provided script tag. Paste this code into the header or footer tracking section of the website or funnel page where you want the widget to appear. After publishing or updating the page, the widget will be live.
Step 4: Visitor Interaction
When a visitor lands on your page, the chat widget will display a microphone icon. Clicking this icon starts the voice session. The visitor's browser will ask for permission to use the microphone, which they must grant. Once connected, they can speak freely with your AI agent. To prevent abuse, if a user connects and disconnects rapidly (e.g., 10 times within 60 seconds), the system will present a reCAPTCHA challenge.
Best Practices
- Choose an agent name that is clear and aligns with your brand's voice.
- Place the widget on high-intent pages like Contact, Pricing, or Service pages.
- Test the feature in different web browsers to ensure microphone permissions work smoothly.
- Be transparent with users by noting calls are not recorded.
- Monitor initial usage to refine your AI agent's responses and configuration.
Security and Compliance
The widget is designed with user privacy and system integrity in mind. The reCAPTCHA system helps block automated misuse. A notice about non-recording is displayed automatically. All audio processing occurs locally in the user's browser following standard permission protocols for microphone and speaker access.
Troubleshooting
Voice Session Won't Start
Possible Cause: The visitor did not grant microphone permission.
Resolution: Instruct them to allow access when the browser prompts them.
No Audio From the AI Agent
Possible Cause: The visitor's speakers are muted or the wrong audio output is selected.
Resolution: Ask them to check their device's audio settings and volume.
Widget Does Not Appear
Possible Cause: The installation script was not pasted correctly.
Resolution: Re-copy the code from the Chat Widget builder and re-insert it into your site's header or footer.
Frequent reCAPTCHA Prompts
Possible Cause: Rapid connection attempts were detected.
Resolution: Avoid quickly reconnecting multiple times in a short period.
Cannot Record Sessions
Possible Cause: Call recording is not a supported feature for this widget.
Resolution: Inform users that conversations are not recorded.
Example: Lead Capture Setup
You can use the Voice AI Chat Widget to capture lead information conversationally.
Objective: Qualify website visitors and capture their details via voice.
Setup Steps:
- Enable the Voice AI Chat Widget in Labs.
- Create a new Chat Widget and select Voice AI Agent as the type.
- Name the agent something like "Qualification Assistant."
- Configure your Voice AI automation to:
- Greet the visitor warmly.
- Ask for their name and what service they're interested in.
- Capture key qualifying details verbally.
- Create a contact record in your CRM with the collected information.
- End the conversation politely.
- Embed the widget on a key landing page, such as a "Get a Quote" or "Schedule a Demo" page.
Expected Experience: A visitor clicks the microphone icon, has a natural conversation with your AI, and their information is seamlessly added to your CRM as a new lead.