Implementar carga de videos en Prontus

Cómo agregar vídeos a los FIDs para mostrarlos en tu sitio con diferentes codificaciones.

Publicado: Viernes 28 de Septiembre de 2018 por David García
Última modificación: Martes 20 de Noviembre de 2018
Transcodificación

Con Prontus es  posible transcodificar archivos de video a múltiples formatos de salida. 

Normalmente, Prontus transcodifica todos los archivos de video a un solo formato. Para necesidades avanzadas, se pueden generar múltiples versiones de un archivo, por ejemplo para transcodificar automáticamente a múltiples resoluciones.

En el menú de Administrar  Configuración  Transconfiguración  

DIR_FFMPEG: Con esta opción se puede indicar la ruta a la carpeta donde se encuentra el ejecutable de ffmpeg. Prontus permite además validar el directorio ingresado para verificar que efectivamente ffmpeg se encuentre allí.

ejemplo: 

Una vez configurados en el administrador del sitio es posible agregar videos por medio de los FID de la siguiente forma:

Agregando panel de video a FID

Cuando estás creando un FID y quieres que tenga carga de video, basta con agregar la siguiente marca reservada la cual te creará un panel de carga de video:

_video_xcode.html

la forma de hacer uso de esta marca es enviándola como parámetro dentro de la marca %%PANEL%%, como verás en el siguiente ejemplo:

%%PANEL(Video , body1, _video_xcode.html, 1)%% 

Donde;

"Video" es el titulo del panel.

"body1" en el nombre del contenedor html que tendrá el video en la plantilla.

"_video_xcode.html" es la macro que crea la interfaz para subir videos desde el administrador del sitio.

"1" es el ID del panel, muy necesario en caso de que desees crear varios paneles para subir mas de un video. 

El siguiente es un ejemplo de código del FID con un panel para publicar videos: 

<!DOCTYPE html>
<html lang="es">
  <head>
    %%MACRO(_head.html)%%
<script src="/prontus/cpan/js-local/MultiTag.class.js"></script> 
</head>%%MACRO(_open_body.html)%%
%%MENU%% 
%%ITEM(Multimedia, body1)%%
%%/ITEM%%  
%%/MENU%% 
<div class="main-fid" id="fid"> 
%%MACRO(_titulo_principal.html)%% 
<div class="content"> 
%%MACRO(_publicacion_directa.html)%% 
<div class="panel-group"> 
%%PANEL(Video , body1, _video_xcode.html, 1)%%  
</div> 
</div> 
</div> 
%%MACRO(_close_body.html)%%</html>

Colocar marcas de video en la plantilla del artículo.  

Una vez creado el FID, es necesario colocar las marcas requeridas para mostrar el video en el sitio una vez que este es cargado desde el administrador, en la plantilla que tenga configurado el FID se debe agregar el siguiente código: 

%%IF(MULTIMEDIA_video1)%%
<div id="prontusPlayer"></div>
<script type="text/javascript" >
prontusPlayer.mediaController.install({
"player": {
"forceAdOnAndroid": true,
"autoPlay": %%IF(chk_autoplay)%%true%%/IF%%%%NIF(chk_autoplay)%%false%%/NIF%%,
"image": "%%FOTOFIJA_VID650%%",
"forceSize": false,
"swf": "/%%_PRONTUS_ID%%/js-local/prontusPlayer/prontusPlayer.swf",
"imageFolder": "/%%_PRONTUS_ID%%/js-local/prontusPlayer/imag/",
},
"mediaSrc": {
%%IF(MULTIMEDIA_video1)%%"defaultSrc": "%%MULTIMEDIA_video1%%",%%/IF%%
%%NIF(MULTIMEDIA_video1)%%%%IF(url_youtube)%%"defaultSrc": "%%url_youtube%%",%%/IF%%%%/NIF%%
"onErrorSrc": "%%videodam%%",
},
"contentId": "prontusPlayer",
"id": "13964663462031",
});
</script>
<br/>
%%/IF%%
%%NIF(MULTIMEDIA_video1)%%
%%IF(codigo_embed)%%
<div class="box-video">
%%codigo_embed%%
</div>
%%/IF%%
%%/NIF%%

Además debes asegurarte de que exista el reproductor de videos de Prontus en el siguiente directorio ya que de lo contrario no se podrá reproducir el video en el sitio:

/[nombre del sitio]/js-local/prontusPlayer/prontusPlayer.swf

Artículos Relacionados