Linking to the CSS in Player V3

You can customize your Player V3 skin or theme using a Cascading Style Sheet (CSS) file or inline CSS elements.

In the following example, the HTML page has a link to the myvideo.css file, which contains some CSS styles applied to the div container. Normally, you would use the HTML link element as shown below:
<link href="myvideo.css" rel="stylesheet" type="text/css" />

However for the player, you need to place the reference to the .css file within the creation of the player instance:

var embedCode = "45cmZqNDrKn7TvtpfGa9k9fQSeyK4VaI";

var player = OO.Player.create('playerwrapper',embedCode, {
          width: '800px',
          height: '300px' ,

Specify the css in this way ensures that the player automatically loads your specified style and makes sure its is applied correctly.

Was this article helpful?