Q: What is a voice widget?

A voice widget is a small floating button you embed on your website. When visitors click it, they can speak directly to your AI agent using their device microphone and speakers — it works like a phone call but entirely through the browser. Key features: no app download required (works natively in Chrome, Safari, Firefox, and Edge on desktop and mobile), real-time voice conversation, customizable appearance to match your brand, knowledge base integration so it gives accurate answers about your business, and appointment booking support. Voice widgets are billed at 0.18 euros per minute of conversation, deducted from your wallet balance.

Question 1

What is a voice widget?

Accepted Answer

A voice widget is a small floating button that you embed on your website. When visitors click it, they can speak directly to your AI agent using their device's microphone and speakers. It works like a phone call, but entirely through the browser.

Key features

No app download required: Works natively in Chrome, Safari, Firefox, and Edge on both desktop and mobile
Real-time voice conversation: Visitors talk naturally, just like a phone call, and hear the AI respond in a natural voice
Customizable appearance: Match your brand colors, choose the position on the page, and control the button size
Knowledge base integration: The widget agent uses the same knowledge base as your phone agents, so it gives accurate answers about your business
Appointment booking: Visitors can book appointments through the widget if you enable the booking feature

Voice widgets are billed at 0.18 euros per minute of conversation, deducted from your wallet balance.

Question 2

Creating a voice widget agent

Accepted Answer

Each voice widget has its own AI agent with separate settings, voice, and instructions. Click Widgets in the left sidebar, click Create New and select Voice Widget, fill in the configuration (name for internal use, voice from 110+ options, language for conversations, system prompt with instructions for how the AI should behave, and greeting message for when someone opens the widget), and click Create. After creating the widget, assign knowledge base entries to it so it can answer questions about your business, then customize the appearance and embed it on your site.

Question 3

Customizing appearance

Accepted Answer

Open your widget from the Widgets page and go to the Appearance tab. Configuration options include: Primary color (the main color of the widget button and interface, use your brand color for a seamless look), Position (bottom-right or bottom-left of the screen, bottom-right is most common), Bubble size (small, medium, or large — medium works well for most websites, large if you want it as a primary call-to-action), Branding (show or hide the "Powered by Staffify" label), and Domain whitelist (restrict which domains can load your widget for security). Changes are reflected immediately in the preview.

Question 4

Embedding on your website

Accepted Answer

Adding the voice widget to your website takes just one line of code and works with any website platform. Open your widget, click Get Embed Code or go to the Embed tab, copy the code snippet (a script tag with your widget ID), and paste it into your website just before the closing body tag. Platform-specific instructions: WordPress — use the Insert Headers and Footers plugin and paste in the footer section; Shopify — open theme.liquid and paste before the closing body tag; Wix — go to Settings, Custom Code, and add the snippet in the body end; Squarespace — go to Settings, Advanced, Code Injection, and paste in the Footer section. The widget loads asynchronously and will not slow down your website.

Question 5

Enabling appointment booking

Accepted Answer

Your voice widget can book appointments directly during conversations. Open your widget, go to the Booking or Appointments tab, toggle Enable appointment booking to on, configure the settings (appointment duration, buffer time between appointments, and available hours for each day), connect your Google Calendar so the AI can check real-time availability and add confirmed bookings automatically, and click Save. When a visitor asks to book an appointment, the AI suggests available times, confirms the details (name, email, phone), and creates the booking. Both you and the visitor receive a confirmation. Manage all appointments from the Appointments section of your dashboard.

Question 6

Testing your widget

Accepted Answer

After embedding the widget on your website, visit your site in a browser (Chrome or Safari recommended), click the widget button in the corner, allow microphone permission when prompted, wait for the AI greeting and start speaking to test questions and scenarios, and close the widget when finished. Then go back to your Staffify dashboard, click Widgets in the sidebar, find your test conversation, and review the transcript to verify the AI gave correct answers. Troubleshooting: widget does not appear (check embed code placement and domain whitelist), no audio (check browser microphone permissions and device volume), AI gives wrong answers (update your knowledge base), mobile issues (requires a stable internet connection for real-time audio).

Voice Widget Setup

Key features