name_pronunciation
The Name Pronunciation module lets site visitors hear how names should be pronounced. Content editors can record audio directly from their browser's microphone or upload pre-recorded audio files. Visitors see a simple speaker button that plays the pronunciation when clicked.
This is ideal for organizations where correct name pronunciation matters—universities with diverse student bodies, corporate directories, staff profiles, or any site where people's names deserve to be said correctly.
Features
- Browser-based recording: Click "Record," speak the name, click "Stop"—no external software required
- File upload option: Upload pre-recorded MP3, WAV, OGG, or other audio files as an alternative to recording
- Written pronunciation field: Add phonetic spelling (e.g., "CARE-sun" or "car-SON") alongside or instead of audio
- Simple playback: Visitors click a speaker icon button to hear the pronunciation
- Multiple audio format support: Automatically uses the best format for the visitor's browser (WebM, OGG, MP4, MP3)
- Preview before saving: Content editors can listen to their recording before submitting
- Configurable display: Choose whether to show the description, written pronunciation, or customize button text
- Accessibility-focused: ARIA labels, keyboard navigation, and visual feedback for all states
Post-Installation
- Go to Structure → Content types and select a content type (or create a new one)
- Click Manage fields and add a new field
- Select Name Pronunciation as the field type
- Configure allowed file extensions and maximum recording duration in field settings
- Go to Manage display to configure how the player appears (show/hide description, customize button text)
When editing content, you'll see:
- A Record/Stop button for browser recording
- An Upload field for pre-recorded files
- A Written Pronunciation text field for phonetic spelling
- A Description field for labels like "First name" or "Full name"
Additional Requirements
Drupal core only—no additional modules or external libraries required.
The module uses the browser's native MediaRecorder API, which is supported by all modern browsers:
- Chrome/Edge 49+
- Firefox 25+
- Safari 14+
- Opera 36+
Recommended modules/libraries
None required. The module is fully self-contained.
For sites that need more advanced audio handling (multiple audio players with different styles, waveform visualization), you might also explore AudioField for playback-focused features.
Similar projects
- Audio Recorder Widget: A field widget for standard file fields that adds recording capability using the vmsg library. Requires an external JavaScript library. Name Pronunciation differs by providing a complete, purpose-built field type specifically designed for name pronunciations, with no external dependencies.
- Voice Recorder: A general-purpose voice recording module with MP3 encoding. Name Pronunciation is lighter-weight and focused specifically on the name pronunciation use case.
- Media Recorder: Integrates recording with Drupal's Media system. Name Pronunciation is simpler and doesn't require the Media module.
What makes Name Pronunciation different: It's a single-purpose module focused specifically on name pronunciations. It includes the written pronunciation field, requires no external libraries, and provides a streamlined experience for both editors and visitors.
Supporting this Module
This module was developed at UC Davis. If you find it useful, please consider:
- Reporting bugs and feature requests in the issue queue
- Contributing code improvements via merge requests
- Sharing how you're using the module with the community
Community Documentation
Documentation and video walkthroughs coming soon.