How to make my player mobile-friendly

The player's embed code will need to be modified for the player to be responsive or mobile-friendly. A responsive player will automatically scale in size to fit any mobile or desktop device the stream may view, thereby delivering the best viewing experience to all viewers.

How do I modify the embed code to make it responsive?

The type of embed code you are currently using will determine the changes you need to make to your embed code to be responsive.

Please refer to working samples of embedding the player into responsive UI for both types of embed code here:

Some additional notes on the "holder" or standard embed method:

Specifically, for the standard embed code, the option camvars.rsp_mode = "aspect"; will affect whether the player is responsive.

Some additional notes on the iFrame embed method:

The player is responsive inside iFrame. It always fits the iFrame bounds. To make your page design responsive, you have to manage these iFrame bounds using your HTML/CSS or Javascript. The exact solution depends on your design.

The simplest solution you can try is to specify the iFrame dimensions as a percentage of the parent DIV. But, in this case, the parent DIV should be responsive as well.

See the sample below:

<!-- Begin of webcam code -->

<iframe style="width:100%; height:100%; padding:0px; border:0px" seamless="seamless" scrolling="no" marginwidth="0" marginheight="0" allowfullscreen frameborder="0" src=""> </iframe>

<!-- End of webcam code -->

Please note, we cannot guarantee that this approach will work, as all web pages are different.

My player is still not responsive, and I need help!

If you continue to have issues with embedding the responsive player, please email and include the page URL you are attempting to embed the Ozolio Player into. We can review your HTML code to provide you with better recommendations.

Have more questions? Submit a request