Basic HTML structure for template
The fastcontent HTML is distributed in the following sections:
### HEAD
Global para todos los Fastcontent.
<style>
/* FASTCONTENT GLOBALS */
body {
margin: 0 0 0 0;
font-family: sans-serif;
}
#chrome_flags{
background-color: #c33e3e;
width: 100%;
height: 100%;
text-align: center;
font-size: 1vw;
}
#chrome_flasgs_inner{
padding: 20px;
background-color: #AAAAAA;
margin-left: 20%;
width: 60%;
text-align: left;
font-size: 1vw;
}
#chrome_info{
background-color: #228a33db;
width: 100%;
height: 100%;
text-align: center;
font-size: 1vw;
}
.image{
width:100%;
height: 100%;
}
.video{
width:100%;
height: 100%;
object-fit: fill
}
.shape{
width:100%;
height: 100%;
}
</style>
### FASTCONTENT UNIVERSAL SCRIPT
Este script se debe copiar del repo proporcionado anteriormente.
<!-- SCRIPT UNIVERSAL GENERICO DE FASTCONTENT HTML5 - INCLUYE API CONTENT & JQUERY -->
<script>
…… (añadir aquí el código del repo)
</script>>
### PERSONALIZACION DE FASTCONTENT
<!-- SCRIPT ESPECIFICO PARA ESTE CONTENIDO -->
<script>
…… (añadir aquí el código específico para el fastcontent)
</script>
### PERSONALIZACION EVENTOS EN RELACION A PLAYER
<!-- SCRIPTS ADICIONAL PARA EJECUTAR EN EL MOMENTO DE RENDERIZADO (PLAY) DEL CONTENIDO -->
<!-- el evento onRender se disparará cuando el player haga play del contenido -->
<script>
function onRender(slide_index){
console.log("Fastcontent is rendering slide : "+slide_index);
...(añadir aquí el código necesario para ser ejecutado cuando el player dispara el contenido)
}
</script>
### BODY
Crear las variables necesarias y correctamente seteadas que serán reflejadas en el XML.
<div id="background" class=""> </div>
<div id="producto" class="text"> </div>
<div id="imagen"> </div>
<div id="precio" class="text" style="opacity: 0;"> </div>
<div id="descripcion" class="text"> </div>
<div id="promo"> </div>
Last updated