A better way to experience the web
Visitors can listen while they commute, work, or rest their eyes.
The current passage is highlighted as the article is read.
```
```js
window.responsiveVoice.webPlayer?.mount('#article-preview', {
voice: 'UK English Female',
theme: 'responsivevoice',
paragraphSelector: 'h2, p',
position: {
target: '#article-player',
at: 'inside',
},
});
```
This pattern is useful for product pages too: place a short, representative article demo after trust proof such as customer logos, then let visitors try the same player their readers would receive.
### Voice Override
[Section titled “Voice Override”](#voice-override)
Without configuration, the player narrates with the website default voice. To override per player, add a `voice` field. It accepts a name string, a `RegExp`, or a structured query, exactly like the second argument to `speak()`.
```js
window.responsiveVoice.init({
apiKey: 'YOUR_API_KEY',
features: {
webPlayer: {
enabled: true,
voice: 'UK English Female',
rate: 0.95,
},
},
});
```
The full grammar lives in [Voice Selection](/guides/voice-selection/). The same `voice`, `rate`, `pitch`, and `volume` fields are also valid as per-mount overrides on `mount()`.
### Exclude From Narration
[Section titled “Exclude From Narration”](#exclude-from-narration)
Mark any element with `data-rv-skip` to keep it out of the narration. The player still highlights surrounding paragraphs; the skipped element is invisible to the reader's progression.
```html