Skip to main content
The VoiceInfra website widget lets you place an AI-powered voice and chat assistant directly on any webpage. Visitors can start a live voice conversation — right in their browser over WebRTC — or open a text chat window, without downloading any app or dialling a phone number. Your AI agent responds instantly, 24/7, the moment someone clicks the widget.

Two Modes: Voice and Chat

VoiceInfra supports two interaction modes in the website widget, and you can enable both simultaneously so visitors choose how they prefer to communicate. Voice (WebRTC) — Visitors click the widget and speak directly to your AI agent through their browser. No phone number needed, no app to install. WebRTC handles the call natively in Chrome, Firefox, Edge, and Safari. Chat — Visitors type messages and receive instant AI responses in a familiar chat window. Same AI agent, same knowledge base — just text instead of voice.

Key Features

  • Instant voice conversation — zero-friction voice calls straight from the browser
  • No phone number required — visitors do not need to dial anything
  • Lead capture forms — collect name, email, and custom fields before the conversation starts
  • FAQ answering — AI handles common questions immediately, 24/7
  • Appointment booking — AI checks availability and books directly into your calendar
  • Fully customizable — match widget colors, position, and greeting text to your brand

Install the Widget

Step 1: Configure in VoiceInfra

Go to Settings → Website Widget in your VoiceInfra dashboard. On this screen you will:
  • Select the AI agent that powers the widget
  • Choose the widget mode (voice, chat, or voice-chat)
  • Set the appearance — primary color, position, and greeting text
  • Optionally enable lead capture forms with custom fields

Step 2: Copy the script snippet

After configuring, click Get Code. VoiceInfra generates a script tag with your unique agent ID and all settings pre-filled.

Step 3: Paste into your website

Add the script tag to every page where you want the widget to appear. Paste it just before the closing </body> tag in your HTML. No other changes are needed.
<script
  src="https://widget.voiceinfra.ai/loader.js"
  data-agent-id="YOUR_AGENT_ID"
  data-mode="voice-chat"
  async>
</script>
Replace YOUR_AGENT_ID with the agent ID shown in your VoiceInfra dashboard. If you use a CMS like WordPress, Webflow, or Shopify, paste the script in the global footer code section so it appears on every page automatically.

Widget Configuration Options

OptionDescription
data-agent-idYour VoiceInfra agent ID (required)
data-modevoice for voice only, chat for text only, or voice-chat for both
data-positionbottom-right (default) or bottom-left
data-primary-colorWidget accent color as a hex value (e.g., #0057FF)
All other appearance settings — greeting text, hover color, window title, animated orb — are configured in the VoiceInfra dashboard and applied automatically through your agent ID. You do not need to manage them in the script tag.

Real-World Example

A Norwegian business connected their Telnyx phone numbers to VoiceInfra and embedded the website widget on their site. Website visitors can now click the widget to start an instant AI voice conversation — the same AI agent that handles their inbound phone calls. This unified setup means one agent configuration covers both the phone channel and the website, with consistent responses across both touchpoints.

Frequently Asked Questions

No. The widget uses WebRTC, which is built into all modern browsers. Visitors click the widget and speak — nothing to install, no app, no plugin.
Yes. Control the primary color, hover color, screen position, button text, chat window title, and optional animated orb from your VoiceInfra dashboard. Changes apply instantly without updating your website code.
Yes. The widget is fully responsive and adapts to any screen size. Voice and chat modes both work on iOS and Android browsers.
Yes. Set data-mode to voice-chat. The widget displays both a voice call button and a chat option, letting visitors choose how they want to communicate.
Yes. Enable Lead Capture Forms in your widget settings. Visitors fill in name, email, and any custom fields you configure before the AI conversation begins. The AI uses that data to personalize its first message.
Yes. Assign the same AI agent to the website widget and to your SIP number or PBX extension. The agent uses the same knowledge base and persona across all channels.