Web Widget & Chat - eigi.ai Documentation

Overview

Bring your voice AI agents directly to your website visitors. The eigi.ai widget enables instant voice or video conversations without any phone calls or downloads.

Voice Conversations

Crystal-clear voice calls directly in the browser

Video Avatars

Face-to-face interactions with AI video avatars

Screen Sharing

Visitors can share their screen during calls

Camera Support

Enable visitor video for personalized interactions

Quick Setup

Add the widget to any website with a single script tag:

<script
  src="https://unpkg.com/@cliniq360/eigi-widget@latest/dist/eigi-widget.js"
  data-agent-id="your-agent-id"
  async
></script>

That’s it! The widget appears automatically and is ready to use.

Getting Your Agent ID

Create an Agent

Set up your voice agent in the platform

Go to Widget Settings

Navigate to the widget configuration section

Copy Agent ID

Copy the unique agent ID for embedding

Add to Website

Paste the script tag into your HTML

Basic Options

Option	Description	Default
`data-agent-id`	Your agent’s unique ID	Required
`data-position`	Widget position on page	`bottom-right`
`data-theme`	Light or dark theme	`light`
`data-language`	Widget interface language	`en`

Position Options

Bottom Right

bottom-right

Bottom Left

bottom-left

Top Right

top-right

Top Left

top-left

Voice Mode

Browser-Based Voice Calls

When a visitor clicks the widget:

Microphone permission requested (first time only)
Connection established instantly
Two-way voice conversation begins
Full agent capabilities available

Voice Features

Feature	Description
Echo Cancellation	Clear audio without feedback
Noise Suppression	Background noise filtered out
Auto Gain Control	Consistent volume levels
Interruption Handling	Natural conversational flow

Video Mode

AI Avatar Conversations

Enable video avatars for face-to-face interactions:

Configure Video Agent

Set up your agent with a video avatar

Enable Video Widget

Turn on video mode in widget settings

Choose Avatar

Select from HeyGen or Tavus avatars

Test Experience

Preview the video interaction

Video Options

Option	Description
Avatar Only	Visitor sees avatar, no camera needed
Two-Way Video	Both avatar and visitor camera
Avatar + Screen Share	Avatar with visitor screen sharing

Guided Assistance

Let visitors share their screen for better support:

Technical Support

Walk users through software issues step-by-step

Form Assistance

Help visitors fill out complex forms

Product Demos

Guide users through your product features

Troubleshooting

See exactly what the user sees to solve problems

How It Works

Agent requests screen share during conversation
Visitor approves and selects what to share
Agent can reference what’s on screen
Both continue the voice conversation

Screen sharing is opt-in. Visitors control what they share and can stop sharing at any time.

Visitor Camera

Two-Way Video Conversations

Enable visitor cameras for more personal interactions:

Use Case	Benefit
Identity Verification	Visual confirmation during processes
Document Review	Visitor shows documents to agent
Product Issues	Customer shows physical products
Sign Language	Accessibility support

Privacy Controls

Camera access requires explicit permission
Visitors can disable camera anytime
No recording without consent
Clear visual indicators when camera is active

Visual Styling

Match the widget to your brand:

Customization	Options
Button Color	Any hex color
Button Icon	Custom icon or default
Button Size	Small, medium, large
Button Text	Custom label
Theme	Light, dark, or custom

Custom Branding

<script
  src="https://unpkg.com/@cliniq360/eigi-widget@latest/dist/eigi-widget.js"
  data-agent-id="your-agent-id"
  data-button-color="#4F46E5"
  data-button-text="Talk to us"
  data-theme="dark"
  async
></script>

Chat Fallback

When Voice Isn’t Available

Provide alternatives when voice isn’t suitable:

Text Chat

Type-based conversation with the same AI

Callback Request

Schedule a phone call for later

Automatic Fallback

The widget can automatically offer chat when:

Microphone access is denied
Poor audio quality detected
User prefers typing

Proactive Engagement

Start conversations proactively:

Trigger	Use Case
Time on Page	Open widget after 30 seconds
Scroll Depth	Engage when user scrolls to pricing
Exit Intent	Catch users about to leave
Page Visit	Specific pages trigger specific agents

Programmatic Control

Control the widget with JavaScript:

// Open the widget
EigiWidget.open();

// Close the widget
EigiWidget.close();

// Open with specific message
EigiWidget.open({ message: "Hi, I need help with pricing" });

// Listen for events
EigiWidget.on("call.started", () => {
  console.log("Call started");
});

Track Engagement

Monitor widget performance:

Metric	Description
Widget Opens	How often visitors open the widget
Calls Started	Conversations initiated
Avg. Duration	How long conversations last
Conversion Rate	Leads captured from widget
Bounce Rate	Widget opened but no call started

Conversion Tracking

Connect widget events to your analytics:

EigiWidget.on("call.completed", (data) => {
  // Send to Google Analytics
  gtag("event", "voice_call_completed", {
    duration: data.duration,
    outcome: data.outcome,
  });
});

Mobile Experience

Optimized for All Devices

Responsive Design

Adapts to any screen size

Touch Friendly

Easy tap targets for mobile users

Low Bandwidth

Works on slower connections

App-Like Feel

Full-screen mode on mobile

Multi-Language Support

Global Visitors

Support visitors in their language:

Setting	Description
Widget UI	Button text, loading messages in visitor’s language
Agent Language	AI responds in the same language
Auto-Detection	Detect browser language automatically

A/B Testing

Test different configurations:

Button colors and positions
Proactive trigger timings
Opening messages
Agent personalities

Track which variations convert better and iterate.

Best Practices

Prominent Placement: Position the widget where it’s visible but not intrusive.

Match Your Brand: Use colors and messaging consistent with your website.

Set Expectations: Use button text that tells visitors what will happen (“Talk to AI Assistant”).

Test the widget experience thoroughly on different browsers and devices before going live.

Troubleshooting

Widget not appearing

No audio / microphone issues

Check browser has microphone permission - Verify HTTPS (required for microphone access) - Test microphone with other apps - Try a different browser

Video not working

Confirm video avatar is configured - Check camera permissions in browser - Ensure sufficient bandwidth - Verify agent supports video mode

Poor audio quality

Check internet connection stability - Close other apps using audio - Use headphones to prevent echo - Try a wired connection instead of WiFi

​Overview

​Widget Capabilities

​What the Widget Offers

Voice Conversations

Video Avatars

Screen Sharing

Camera Support

​Embedding the Widget

​Quick Setup

​Getting Your Agent ID

​Widget Configuration

​Basic Options

​Position Options

Bottom Right

Bottom Left

Top Right

Top Left

​Voice Mode

​Browser-Based Voice Calls

​Voice Features

​Video Mode

​AI Avatar Conversations

​Video Options

​Screen Sharing

​Guided Assistance

Technical Support

Form Assistance

Product Demos

Troubleshooting

​How It Works

​Visitor Camera

​Two-Way Video Conversations

​Privacy Controls

​Widget Customization

​Visual Styling

​Custom Branding

​Chat Fallback

​When Voice Isn’t Available

Text Chat

Callback Request

​Automatic Fallback

​Proactive Engagement

​Triggering the Widget

​Programmatic Control

​Widget Analytics

​Track Engagement

​Conversion Tracking

​Mobile Experience

​Optimized for All Devices

Responsive Design

Touch Friendly

Low Bandwidth

App-Like Feel

​Multi-Language Support

​Global Visitors

​A/B Testing

​Optimize Your Widget

​Best Practices

​Troubleshooting

Overview

Widget Capabilities

What the Widget Offers

Embedding the Widget

Quick Setup

Getting Your Agent ID

Widget Configuration

Basic Options

Position Options

Voice Mode

Browser-Based Voice Calls

Voice Features

Video Mode

AI Avatar Conversations

Video Options

Screen Sharing

Guided Assistance

How It Works

Visitor Camera

Two-Way Video Conversations

Privacy Controls

Widget Customization

Visual Styling

Custom Branding

Chat Fallback

When Voice Isn’t Available

Automatic Fallback

Proactive Engagement

Triggering the Widget

Programmatic Control

Widget Analytics

Track Engagement

Conversion Tracking

Mobile Experience

Optimized for All Devices

Multi-Language Support

Global Visitors

A/B Testing

Optimize Your Widget

Best Practices

Troubleshooting