Skip to main content
The web chat widget is only available for projects that were set as the web chat type upon creation. Phone projects cannot use the web chat widget.
Cover Placeholder The quickest way to launch your agent is with the web chat widget. You can deploy it to production in minutes, making it ideal for customer support, lead capture, or any use case where users interact with your agent through a website. The widget supports text and voice input, and can be displayed as a floating widget, popover, or embedded directly into your page.

​
Adding the widget to your website

Before adding the widget, you’ll need to publish a production version of your agent. Once published, open the Widget tab in the sidebar, then copy the code snippet into your website’s codebase. If you’re not a developer and aren’t sure where to add this code, try asking ChatGPT. Cover Placeholder

​
Customizing your widget

Your widget should match your brand. From the Widget settings page, scroll down to configure your agent’s colors, icons, launcher style, interface type, and more. You can also add placeholder text and privacy policy links. Customers on a Business plan can disable Voiceflow branding. Cover Placeholder

​
Choosing a modality

The widget supports two modalities: chat and voice. You can configure this in Widget → Modality & Interface → Modaility. Chat modality is the default. Users type messages and see responses as text. This works well for most web use cases. With chat modality, you can optionally enable voice features:
  • Dictation allows users to input text using speech-to-text.
  • Voice output lets users hear responses using the text-to-speech model configured in your project settings.
  • Voice mode enables hands-free conversation. Once the user presses the voice button, they can speak naturally without pressing it again for each message.
Voice modality makes the conversation behave like a phone call. Message history isn’t displayed to the user, and they don’t need to press a button to speak. Users can interrupt the agent by speaking while it responds. The written transcript is still saved for your records.
Voice features consume credits. Learn more about credits.

​
Configuring security settings

Three Security options are available at the bottom of the widget settings page:
  • Approved domains restricts the widget to work only on specified websites.
  • Legal disclaimer displays a message users must accept before chatting. Enable this if your company policy or local regulations require it.
  • Chat transcript saving controls whether conversations are saved as transcripts. Disable this when processing sensitive information.

​
Publishing changes

Any changes to widget settings require you to publish a new version of your agent before they take effect in production.

​
Developer customizations

If you’re a developer, you can extend the widget’s functionality through the web chat API, custom styling, and extensions.