We use cookies to enhance your experience

We use essential cookies for site functionality and optional cookies like Google Analytics to understand how you use our site. You can customize your preferences at any time. Learn more

Voice Input

Enable voice-to-text functionality so users can speak their messages instead of typing.

Voice Input Benefits

Voice input makes your chat accessible to users who prefer speaking, those with typing difficulties, and mobile users who find voice faster than touch keyboards.

Enable Voice Input

Basic Configuration

Enable the microphone button in the input area:

Supported APIs

Web Speech API (Default)

Built into modern browsers. Free, privacy-friendly, works offline.

Browser Support:

Chrome, Edge, Safari (limited). Not Firefox.

Google Cloud Speech-to-Text

More accurate, supports more languages. Requires API key and billing.

OpenAI Whisper

Excellent accuracy, multilingual. Requires OpenAI API key.

Language Configuration

Recognition Language

Set the language for speech recognition:

Supported Languages

Web Speech API supports 50+ languages. Cloud providers support 100+ languages with varying accuracy.

Multi-Language Support

Allow users to select their preferred language:

Recording Behavior

Recording Modes

Push-to-Talk

Hold button to record, release to stop. Quick and intuitive.

🎤 Hold to speak...

Click-to-Toggle

Click once to start, click again to stop. Better for longer messages.

● Recording... Click to stop

Auto-Stop

Automatically stop after silence detected. Hands-free experience.

Visual Feedback

Provide clear feedback during recording:

  • Animated Microphone Icon: Pulsing or waveform animation
  • Recording Timer: Show elapsed time
  • Waveform Visualization: Real-time audio level display
  • Status Text: "Listening...", "Processing...", "Done!"

Recording...

0:05

Transcription Display

Real-Time Transcription

Show text as it's being transcribed:

You're saying:
Hello, I need help with my order |

Confidence Levels

Handle low-confidence transcriptions:

If confidence is low, consider showing a warning and allowing users to edit before sending.

Permissions & Privacy

Microphone Permission

Handle browser microphone permissions gracefully:

First Time

Show explanation before requesting permission: "We need microphone access for voice input."

Permission Denied

Provide instructions to enable: "Please allow microphone access in your browser settings."

Permission Granted

Show success indicator and enable voice button.

Privacy Considerations

Respect user privacy:

  • Clear Indicator: Always show when microphone is active
  • Easy Cancellation: Allow stopping recording anytime
  • No Background Recording: Only record when explicitly activated
  • Data Retention: Don't store audio files unless necessary
  • Privacy Policy: Disclose voice data handling in privacy policy

GDPR Compliance

Voice recordings are personal data. Ensure proper consent and data handling per GDPR requirements.

Error Handling

Handle common voice input errors:

No Speech Detected

"We didn't hear anything. Please try again."

Network Error

"Connection lost. Please check your internet and try again."

Language Not Recognized

"We couldn't understand. Try speaking more clearly."

Accessibility

Make voice input accessible to all users:

  • Keyboard Shortcuts: Spacebar to activate voice (when focused)
  • Screen Reader Support: Announce recording status and transcription
  • Visual Feedback: Don't rely solely on audio cues
  • Alternative Methods: Always keep text input available
  • Clear Labels: "Voice Input" button with descriptive ARIA labels

Next: File Upload

Learn how to enable file attachments so users can share images and documents.

File Upload Setup →
Hi and welcome! How can ChatWidgetPro help you ?