Radiant Media Player

Audio-only related content

Documentation sections


Audio-only related content works very similarly to our video related content implementation so we advise first to review this area of our documentation before moving forward with audio-only related content.

Note that you cannot mix both video and audio-only content for related content. It has to be one or the other.

Video ads or audio ads can be played each time a new audio item is loaded within the player. The audio-only related content UI is fully compatible with mobile devices. A built-in error-recovery mechanism is also provided to skip audio related items that may be unavailable.

Supported audio-only streaming protocols are HLS, DASH and MP3/OGG/M4A progressive download. Other video related content features and restrictions generally apply to audio-only related content.

Related content data set with a JSON file

The audio-only related content can be initialised by passing to the relatedLoc setting a URI to a JSON file holding audio-only related content data. You will also need to set relatedAudioOnly player setting to true. Here is a full example of a well-formatted JSON file that can be used for input to audio-only related content.

The general related content JSON file structure is as below. The required fields for each item are:

  • src - streaming source for the audio related item
  • poster - poster frame for the audio related item - size should be 832x468
  • contentTitle - title for the audio related item
  • contentDescription - description for the audio related item

All items within the audio related list must have the same src type (e.g. if you use HLS - each related item must have a HLS URI in its src information; if you use MP3 progressive download - each related item must have a MP3 URI in its src information)

Optional fields for each related item are:

  • thumbnail (highly recommended) - thumbnail frame for the related item (size should be 332x186) - if thumbnail information is not found poster data will be used
  • adTagUrl - URI to the video or audio adTag to be loaded when the audio related item starts - if you use ads you must also set the player setting ads to true
  • adTagWaterfall - an array of URI to be used for client-side waterfalling - see here for more information
  • contentDuration: duration for the related item - expressed as hh:mm:ss
  • related: URI to a new related JSON specific to current related item
  "playlist": [
      "src": {
        "hls": "your-audio-only-hls-url-1.m3u8"
      "poster": "https://www.radiantmediaplayer.com/media/playlist/poster/item-1.jpg",
      "thumbnail": "https://www.radiantmediaplayer.com/media/playlist/poster/item-1-thumbnail-related.jpg",
      "adTagUrl": "https://www.radiantmediaplayer.com/vast/tags/inline-linear.xml",
      "contentTitle": "Related Item 1",
      "contentDuration": "01:51",
      "contentDescription": "Description for related item 1",
      "related": "https://www.radiantmediaplayer.com/media/playlist/related-1.json"
      "src": {
        "hls": "your-audio-only-hls-url-2.m3u8"
      "poster": "https://www.radiantmediaplayer.com/media/playlist/poster/item-2.jpg",
      "thumbnail": "https://www.radiantmediaplayer.com/media/playlist/poster/item-2-thumbnail-related.jpg",
      "adTagUrl": "https://www.radiantmediaplayer.com/vast/tags/inline-linear-skippable.xml",
      "contentTitle": "Related Item 2",
      "contentDuration": "10:53",
      "contentDescription": "Description for related item 2",
      "related": "https://www.radiantmediaplayer.com/media/playlist/related-2.json"
      "src": {
        "hls": "your-audio-only-hls-url-3.m3u8"
      "poster": "https://www.radiantmediaplayer.com/media/playlist/poster/item-3.jpg",
      "thumbnail": "https://www.radiantmediaplayer.com/media/playlist/poster/item-3-thumbnail-related.jpg",
      "adTagUrl": "https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator=",
      "contentTitle": "Related Item 3",
      "contentDuration": "09:56",
      "contentDescription": "Description for related item 3",
      "related": "https://www.radiantmediaplayer.com/media/playlist/related-3.json"

Similarly to video related content you can also pass audio-only related content data as a JavaScript array of objects. See video related content docs for more information.

Audio-only related content settings

relatedAudioOnly: Boolean

This enables audio-only related content layout required to properly display a list of audio-only content. Default: false.

Other settings for video related content also apply for audio-only related content

Audio-only related content code example - see this example live here

The below code is used to display the audio-only related content example provided above:

Take note of the additional div elements required to display the audio-only related content UI.

<script src="https://cdn.radiantmediatechs.com/rmp/5.8.5/js/rmp.min.js"></script>
<!-- Here is our specific markup for audio-only related content -->
<div id="rmpPlayer"></div>
var settings = {
  licenseKey: 'your-license-key',
  // if you want ads to show uncomment this next setting
  // ads: true,
  // our related content settings
  relatedUpNextOffset: 10,
  relatedUpNextAutoplay: true,
  relatedEndedLoop: false,
  relatedLoc: 'https://www.radiantmediaplayer.com/media/playlist/audio-only/audio-related-hls.json',
  // our audio-only related content setting
  relatedAudioOnly: true
var elementID = 'rmpPlayer';
var rmp = new RadiantMP(elementID);

The video related content API also applies to audio-only related content.

Additional support notes

The support notes for video related content also apply to audio-only related content.

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License.