Radiant Media Player

Logo inclusion



Documentation sections


Logo settings

You can brand your player with a custom logo using the following player settings:

logo: String

Path or URL to logo image. Default: '' which implies no logo is wanted on the player. Suggested size for logo: 200px width x 50px height. By default the logo is positioned at the top-left corner of the video to fit in with other player UI elements. You can move it with the logoPosition setting or with CSS (targeting the CSS class .rmp-logo).
Logo image formats should be PNG, JPEG or GIF.

logoLoc: String

URL to open when the custom logo is clicked or touched. If not provided the logo will still be displayed on the player but will not be click-able. Default: ''.

logoPosition: String

This will set the logo position on stage. 4 values are available: 'topleft', 'bottomleft', 'topright', 'bottomright'. Default: 'topleft'.
The logo has a default padding value of 8px. This value can be adjusted with CSS.

logoWatermark: Boolean

If set to true the logo will not auto-hide with the control bar and act as a watermark logo. Default: false.

logoMargin: String

Sets the margin for the logo. You can specify each margin with values like '8px 4px 8px 4px'. Default: '8px'.


Player code example - see this example here

<script src="https://cdn.radiantmediatechs.com/rmp/5.6.0/js/rmp.min.js"></script>
<div id="rmpPlayer"></div>
<script>
var src = {
  hls: 'https://your-hls-url.m3u8'
};
var settings = {
  licenseKey: 'your-license-key',
  src: src,
  width: 640,
  height: 360,
  contentMetadata: {
    poster: [
      'https://your-poster-url.jpg'
    ]
  },
  // Logo settings
  logo: 'https://your-logo-url.png',
  logoLoc: 'https://www.radiantmediaplayer.com',
  logoPosition: 'topleft',
  logoWatermark: false
};
var elementID = 'rmpPlayer';
var rmp = new RadiantMP(elementID);
rmp.init(settings);
</script>

Logo API

getLogo()
rmp.getLogo();

This method returns an Object with the current player logo information. This Object holds two properties. The img property is a String representing the URL to the logo image. The loc property is a String representing the link to open when the logo is interacted with. null is returned if this logo information are not available. Example of returned value when available:

{
  img: 'url-logo-image',
  loc: 'link-to-open-when-logo-is-clicked'
}
setLogo(logo)
rmp.setLogo({
  img: 'url-logo-image',
  loc: 'link-to-open-when-logo-is-clicked'
});

When invoked, this method will update the player logo information. Note that player must be initialised with the logo setting for this method to have affect. Parameter value is an Object holding two properties. The img property is a String representing the new URL to the logo image. The loc property is a String representing the new link to open when the logo is interacted with. To unset logo you can set img: ''.

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