Text highlighting

Learn how to enable and customize text highlighting on hover and during playback.

Text highlighting improves the user experience of playback from segments by making it easier to identify clickable segments and follow the text while listening.

Enable text highlighting

Option 1: BeyondWords Player script

Set highlightSections to any of the following:

  • all enables highlighting on both title, summary, and body segments (default).

  • body enables highlighting on only body segments.

  • none disables highlighting on all segments.

You can use a double-barreled string to customize the behavior of text highlighting for the currentSegment and hoveredSegment. For example, the string all-none enables highlighting for the currentSegment and disables it for the hoveredSegment. The string none-body disables highlighting for the currentSegment and enables it for hovered body segments.

This feature will only work for elements that have been correctly marked up on your page with the data-beyondwords-marker attribute. See Add Markers.

Customize text highlighting colors

Option 1: BeyondWords Player script

Set highlightColor to any CSS color, including named colors, HEX, RGBA and even linear gradients. The default is #EEEEEE.

Last updated