Customize our audio players

Learn how to share your audio using our customizable audio players.

You can share your BeyondWords audio using three customizable audio player UIs:

Using these players, you can automatically embed audio, manually embed audio, or share audio via URL. All audio is hosted on and streamed from BeyondWords.

Small Player

Small Player featuresSmall Player features

Small Player features

The Small Player is used for automatically embedded audio. This means it is used by the Ghost audio player script and WordPress plugin, as well as the corresponding iFrame code, JavaScript SDK, iOS SDK, and Android SDK.

The Small Player can also be used to embed audio manually. It supports dark mode and features:

  • Customizable background color (this can be transparent)

  • Play/pause button — the icon color is customizable

  • Customizable player text — this is 'Listen to this article' (or a translation) by default (see this blog post for customization tips and inspiration) — the text color is customizable

  • Playback progress bar with position and duration times

  • Playback speed — the default is 1x, but the listener can change to 0.5x, 1.25x, 1.5x, or 2x

  • Hyperlinked BeyondWords credit (on hover only)

Customize the Small Player

💡

JavaScript developers can use a custom user interface by setting the UIenabled parameter to false.

Please note that player settings can affect multiple player types (Small, Medium, and/or Large). They also apply to all audios on a project. If you wish to publish certain audios under different settings, you will need to create another project.

  1. Go to the 'Distribution (Player)' section of your project dashboard

  2. Scroll down to 'Player settings'

  1. Customize light mode colors (optional) — enter a hex color code into the field, or click the color to choose a default option

    1. Player icon color: The color of the play button — make sure this contrasts against the background color

    2. Text color: The color of the player text — make sure this contrasts against the background color

    3. Background color: The color of the player's background — this can be TRANSPARENT

  2. Customize dark mode colors (optional) — use the toggle to switch to dark mode settings and customize as above

  3. Change player text (optional) — enter the call-to-action text that you'd like to appear on the Small Player

  4. Select 'Save changes'

Medium Player

Medium Player featuresMedium Player features

Medium Player features

The Medium Player can be used when manually embedding audio via iFrame. WordPress users can also embed this player automatically using the speechkit_js_player_params filter.

It supports dark mode and features:

  • Customizable background color (this can be transparent)

  • Project title — this can be edited in the 'Settings' section of your project (text color is customizable)

  • Audio title — this can be edited anytime (text color is customizable)

  • Featured image (optional)

  • Play/pause button — the icon color is customizable

  • Playback progress bar with position and duration times

  • Playback speed — the default is 1x, but the listener can change to 0.5x, 1.25x, 1.5x, or 2x

  • Hyperlinked BeyondWords credit (on hover only)

Customize the Medium Player

Please note that player settings can affect multiple player types (Small, Medium, and/or Large). They also apply to all audios on a project. If you wish to publish certain audios under different settings, you will need to create another project.

  1. Go to the 'Distribution (Player)' section of your project dashboard

  2. Scroll down to 'Player settings'

  1. Customize light mode colors (optional) — enter a hex color code into the field, or click the color to choose a default option

    1. Player icon color: The color of the play button — make sure this contrasts against the background color

    2. Text color: The color of the audio title text — make sure this contrasts against the background color

    3. Background color: The color of the player's background — this can be TRANSPARENT

  2. Customize dark mode colors (optional) — use the toggle to switch to dark mode settings and customize as above

  3. Upload an image (optional) — this will appear on the Medium Player and the Large Player (which is used when sharing audio via URL)

  4. Select 'Save changes'

Large Player

Large Player featuresLarge Player features

Large Player features

The Large Player is used for audio shared via URL. It features:

  • Featured image (optional)

  • Audio title — this can be edited anytime (text color is customizable)

  • Playback progress bar with position and duration times

  • Buttons for skipping forwards or backwards by 10 seconds

  • Play/pause button — the icon color is customizable

  • Playback speed — the default is 1x, but the listener can change to 0.5x, 1.25x, 1.5x, or 2x

  • Hyperlinked BeyondWords credit

Customize the Large Player

Please note that player settings can affect multiple player types (Small, Medium, and/or Large). They also apply to all audios on a project. If you wish to publish certain audios under different settings, you will need to create another project.

  1. Go to the 'Distribution (Player)' section of your project dashboard

  2. Scroll down to 'Player settings'

  1. Customize light mode colors (optional) — enter a hex color code into the field, or click the color to choose a default option

    1. Player icon color: The color of the play button — make sure this contrasts against the background color

    2. Text color: The color of the audio title text — make sure this contrasts against the background color

    3. Background color: The color of the player's background — this can be TRANSPARENT

  2. Customize dark mode colors (optional) — use the toggle to switch to dark mode settings and customize as above

  3. Upload an image (optional)

  4. Select 'Save changes'

FAQs

Can I change the default playback speed?

It not currently possible to change the default playback speed. However, listeners can change the playback speed to 0.5x, 1x, 1.25x, 1.5x, or 2x when using our players.


Will the audio players slow down my website?

Our players should not slow down your website. We’ve designed BeyondWords to minimize any effect on latency. The JavaScript player is lightweight and embedded via an iFrame, which means that it only loads after all other page content has loaded. We’re also the only text-to-speech service that transcodes audio for HLS (HTTP Live Streaming), which splits audio into 15-second segments at different bit rates to ensure frictionless listening.



Did this page help you?