Skip to main content

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.

Widget Capabilities

What the Widget Offers

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

Embedding the Widget

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

1

Create an Agent

Set up your voice agent in the platform
2

Go to Widget Settings

Navigate to the widget configuration section
3

Copy Agent ID

Copy the unique agent ID for embedding
4

Add to Website

Paste the script tag into your HTML

Widget Configuration

Basic Options

OptionDescriptionDefault
data-agent-idYour agent’s unique IDRequired
data-positionWidget position on pagebottom-right
data-themeLight or dark themelight
data-languageWidget interface languageen

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:
  1. Microphone permission requested (first time only)
  2. Connection established instantly
  3. Two-way voice conversation begins
  4. Full agent capabilities available

Voice Features

FeatureDescription
Echo CancellationClear audio without feedback
Noise SuppressionBackground noise filtered out
Auto Gain ControlConsistent volume levels
Interruption HandlingNatural conversational flow

Video Mode

AI Avatar Conversations

Enable video avatars for face-to-face interactions:
1

Configure Video Agent

Set up your agent with a video avatar
2

Enable Video Widget

Turn on video mode in widget settings
3

Choose Avatar

Select from HeyGen or Tavus avatars
4

Test Experience

Preview the video interaction

Video Options

OptionDescription
Avatar OnlyVisitor sees avatar, no camera needed
Two-Way VideoBoth avatar and visitor camera
Avatar + Screen ShareAvatar with visitor screen sharing

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

  1. Agent requests screen share during conversation
  2. Visitor approves and selects what to share
  3. Agent can reference what’s on screen
  4. 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 CaseBenefit
Identity VerificationVisual confirmation during processes
Document ReviewVisitor shows documents to agent
Product IssuesCustomer shows physical products
Sign LanguageAccessibility support

Privacy Controls

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

Widget Customization

Visual Styling

Match the widget to your brand:
CustomizationOptions
Button ColorAny hex color
Button IconCustom icon or default
Button SizeSmall, medium, large
Button TextCustom label
ThemeLight, 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

Triggering the Widget

Start conversations proactively:
TriggerUse Case
Time on PageOpen widget after 30 seconds
Scroll DepthEngage when user scrolls to pricing
Exit IntentCatch users about to leave
Page VisitSpecific 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");
});

Widget Analytics

Track Engagement

Monitor widget performance:
MetricDescription
Widget OpensHow often visitors open the widget
Calls StartedConversations initiated
Avg. DurationHow long conversations last
Conversion RateLeads captured from widget
Bounce RateWidget 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:
SettingDescription
Widget UIButton text, loading messages in visitor’s language
Agent LanguageAI responds in the same language
Auto-DetectionDetect browser language automatically

A/B Testing

Optimize Your Widget

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

  • Verify the script tag is in your HTML - Check that the agent ID is correct
  • Confirm no JavaScript errors in console - Ensure the agent is active and published
  • Check browser has microphone permission - Verify HTTPS (required for microphone access) - Test microphone with other apps - Try a different browser
  • Confirm video avatar is configured - Check camera permissions in browser - Ensure sufficient bandwidth - Verify agent supports video mode
  • Check internet connection stability - Close other apps using audio - Use headphones to prevent echo - Try a wired connection instead of WiFi