Web Widget
Embed and programmatically control a Virbe virtual being on your website using the virbe-plugin custom element.
Embedding on Your Website
The <virbe-plugin> element supports two display modes: floating (an overlay bubble in the corner of the page) and embedded (inline within your existing page layout) – set via the mode attribute shown below.
Beyond basic embedding, the widget exposes a full JavaScript API that lets you programmatically control conversations, audio, and the widget UI from your own application code.
Quick Start
Add the widget script and element to your HTML page:
<virbe-plugin
profileId="your-profile-id"
profileSecret="your-profile-secret"
mode="embedded"
></virbe-plugin>
<script type="module" src="https://your-dashboard-name.virbe.app/web-component/virbe-plugin.es.js"></script>You can find your Profile ID and Profile Secret in the Virbe dashboard under Profiles. Make sure to authorize your domain before deploying.
What's in This Section
Configuration
HTML attributes, display modes, and CSS styling options.
Methods
Public JavaScript methods for controlling the widget programmatically.
Events
Events emitted by the widget that your application can listen to.
Integration Guide
Step-by-step patterns for vanilla JS and React integration.
Human Handover Example
End-to-end example of handing a conversation from AI to a human operator.