¿Cómo agregar kaltura a mi sitio web?
Hoy les queremos mostrar como configurar el player de kaltura para poder reproducir videos en su sitio web.
Para empezar les explico brevemente, Kaltura es una plataforma que te permite la gestión de video. Puedes obtener más información de la plataforma en esta liga o en su sitio oficial.
Ahora si, vamos a lo que nos interesa.
1.- Añadir el script de configuración dentro de un área del head de tu html
<script src=“http://cdnapi.kaltura.com/p/{partnerId}/sp/{partnerId}00/embedIframeJs/uiconf_id/{uiConfId}/partner_id/{partnerId}”></script>
<html>
<head>
<script src=“http://cdnapi.kaltura.com/p/{partnerId}/sp/{partnerId}00/embedIframeJs/uiconf_id/{uiConfId}/partner_id/{partnerId}“></script>
</head>
<body>
</body>
</html>
Deberas sustituir los valores de configuración dentro de la URL, ejemplo: {partnerId}, {uiConfId}
2.- Agregar contenedor donde vas a crear el player de kaltura
<body>
<div id=“myEmbedTarget” style=“width:400px;height:330px;“></div>
</body>
3.- Agrega el script para configurar y cargar el player de kaltura
<script>
kWidget.embed({
‘targetId’: ‘myVideoTarget’,
‘wid’: ‘_243342’,
‘uiconf_id’ : ‘12905712’,
‘entry_id’ : ‘0_uka1msg4’,
// Plugin configuration / flashvars go here
‘flashvars’:{
‘myPlugin’:{
‘fooAttribute’: ‘bar’,
‘barAttribute’: ‘foo’
},
‘autoPlay’ : true
},
// Ready callback is issued for this player:
‘readyCallback’: function( playerId ){
console.log( “kWidget player ready: ” + playerId );
}
});
</script>
Es importante tener en consideración los siguiente elementos:
‘targetId‘: ‘myVideoTarget’, // el nombre del contenedor donde se crea el player
‘wid‘: ‘_243342’, // Widget id
‘uiconf_id‘ : ‘12905712’, // id del player creado en kaltura
‘entry_id‘ : ‘0_uka1msg4’, // id del video dentro de la plataforma kaltura
Al final debes tener un código como el que te muestro, solo sustituye los valores que se marcan en negrita.
<html>
<head>
<script src=”http://cdnapi.kaltura.com/p/243342/sp/24334200/embedIframeJs/uiconf_id/12905712/partner_id/243342“></script>
</head>
<body>
<div id=”myVideoContainer” itemprop=”video” itemscope itemtype=”http://schema.org/VideoObject” >
<div id=”myVideoTarget” style=”width:400px;height:330px;”>
<!– SEO and video metadata go here –>
<span itemprop=”description” content=”test folgers coffe”></span>
<span itemprop=”name” content=”FolgersCoffe.mpeg”></span>
<span itemprop=”width” content=”400″></span>
<span itemprop=”height” content=”300″></span>
</div>
</div>
<script>
kWidget.embed({
‘targetId’: ‘myVideoTarget‘,
‘wid’: ‘_243342‘,
‘uiconf_id’ : ‘12905712‘,
‘entry_id’ : ‘0_uka1msg4‘,
// Plugin configuration / flashvars go here
‘flashvars’:{
‘myPlugin’:{
‘fooAttribute’: ‘bar’,
‘barAttribute’: ‘foo’
},
‘autoPlay’ : true
},
// Ready callback is issued for this player:
‘readyCallback’: function( playerId ){
console.log( “kWidget player ready: ” + playerId );
}
});
</script>
</body>
</html>
Listo, ya tienes la integración del player de kaltura en tu sitio web. Puedes agregar la configuración del métricas a través de google analytics con