Branding Your Player

JW Player supports both the addition of logo or watermark, as well as a custom text link inside of the right click menu. 

Adding your brand

The logo and right click options are a great way to easily brand your video player, while driving traffic to your website.

Setting the Logo

A dedicated options block, called logo, is available for configuring the logo. This feature works by layering your logo on top of JW Player and does not affect the video file itself. Directly viewing a video or stream outside of JW Player will not have this logo applied to the content. Additionally, the logo will not appear when fullscreen on mobile where the native controls are displayed.

The addition of your logo has the following configurable properties:

file
Location of an external SVG, JPG, PNG or GIF image to be used as watermark (e.g. /assets/logo.png). We recommend using 24 bit PNG images with transparency for JW7, and SVG images for JW8, since they blend nicely with the video.
hide
By default (false), the logo remains visible all the time. When this option is set to true, the logo's visibility is synced with the visibility of other player control elements.
link
The HTTP URL which will load when your watermark image is clicked. (e.g. http://www.mywebsite.com/). If this is not set, a click on the watermark will not do anything.
margin
The custom distance of the logo from the edges of the display in pixels. The default is 8 pixels in JW7 and 20 in JW8. Adjusting this will adjust both the horizontal and vertical margins. The height of the control bar will also be taken into account if the logo is placed at the bottom.
position
This sets the corner in which to display the watermark. It can be top-right (the default), top-left, bottom-right or bottom-left. JW8 includes a fifth location, control-bar, which adds the logo as the leftmost icon in the right grouping of buttons in the control bar.

Setting the Right-click

The right-click does not have a dedicated options block. Instead, two simple global configuration options are available:

abouttext
Additional text which will display in the right-click menu. This must be set in order to use aboutlink
aboutlink
The URL then will open when a user clicks on abouttext. If this is not set, custom text will redirect to http://www.jwplayer.com/learn-more/.

Note: JW Player does not have a way to fully remove the "Powered by JW Player" text.

Branding Example

The appearance of JW Player's right click and logo customizations can be seen below:

 

Here is the configuration of above example:

var playerInstance = jwplayer("myElement");
playerInstance.setup({
	file: "/assets/myVideo.mp4",
	image: "/assets/myVideo.jpg",
	logo: {
		file: '/assets/blenderLogo.png',
		link: 'http://www.blender.org/foundation/'
	},
	abouttext: "Video Available at Blender.org",
	aboutlink: "http://www.blender.org",
	width: 640,
	height: 270
});

Did you find this article helpful?

Please log in to rate this article.