Cómo incrustar el reproductor en un iframe

  Lo sentimos, esta página está pendiente de traducción al español

You can embed the player on your site via iframe (the same way all video-sharing sites like YouTube distribute their players).

An iframe is the site layout element in which the HTML page is loaded. This page also hosts the player. An example of such page:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
   <head>
      <title></title> 
      <script src='playerjs.js' type='text/javascript'></script>
   </head>
   <body>
   <style>
      html,body{
         margin:0;padding:0;width:100%;height:100%;
      }
   </style>
        
   <div id="playerjs" style="width:100%;height:100%;"></div>
        
   <script type="text/javascript">
      var ps = location.href.substr(location.href.indexOf("html?")+5).split("&");
      var vs = {id:"playerjs"};  
      for(var i = 0; i<ps.length; i++){
         var p = ps[i].substr(0,ps[i].indexOf("="));
         var v = ps[i].substr(ps[i].indexOf("=")+1);
         if(p!=v){
            vs[p] = decodeURIComponent(v);
         }
      }
      if(vs.file){
         var playerjs = new Playerjs(vs);
      }
   </script>
</body>
</html>

For example, you place this code in the player.html file and put it in the player folder. In the same folder should be the player's file (playerjs.js). The iframe code that you embed into the web page will be as follows:

<iframe src="//site.com/player/player.html?file=VIDEO_URL&poster=POSTER_URL&title=TEXT" type="text/html" width=100% height=100% frameborder="0" allowfullscreen allow="autoplay; fullscreen; picture-in-picture;"></iframe>

Player variables (file, poster, etc.) can be passed in the iframe query string.

Download the example (unpack the archive into a folder, copy the player (playerjs.js) into it and run the file test.html)

Step-by-step manual to integrate the player using iframe.


19.10.26
2024 © PlayerJS

Inicio de sesión

Conectarse

Regístrate gratis

Inscríbete
Al registrarte, aceptas Condiciones del servicio
Iniciar sesión si tienes una cuenta.

Restaurar contraseña

Restaurar
¿Ha olvidado su correo electrónico? Contacte con nosotros