Guía de compilación in-page HTML5

Añadir el Enabler de HTML5

El Enabler es la biblioteca de códigos principal de Studio. Se puede considerar el cerebro de la creatividad. Todos los componentes y llamadas de la API deben pasar por el Enabler. La biblioteca Enabler es necesaria para todas las creatividades de rich media. Al añadir el Enabler, se asegura automáticamente de que su creatividad:

  • incluya la funcionalidad de seguimiento estándar de métricas, como el tiempo de exposición, el número de impresiones o el tiempo de interacción, entre otras métricas estándar
  • pueda administrar funciones más complejas, como vídeo y funciones desplegables
Si crea un anuncio con Google Web Designer, el Enabler se incluye automáticamente al seleccionar el entorno de Display & Video 360. No es necesario añadir el código que se muestra a continuación.

Añadir el Enabler

En la etiqueta <head> de su archivo HTML, añada una etiqueta de secuencia de comandos que enlace con el Enabler:

<script src="https://s0.2mdn.net/ads/studio/Enabler.js"></script>

Esto proporciona un objeto singleton en el espacio de nombres global denominado Enabler. Para invocar métodos en este espacio, ejecute Enabler.isInitialized(), Enabler.exit() y así sucesivamente.

Configurar el tamaño de la creatividad

A diferencia de las imágenes o los vídeos, los documentos HTML no tienen dimensiones propias. Para que su anuncio tenga el tamaño adecuado, añada una etiqueta meta de tamaño de anuncio al encabezado del archivo HTML.

Copie la etiqueta meta de ejemplo que se muestra más abajo y cambie la anchura y la altura para que coincidan con el tamaño de la creatividad.

Ejemplo de etiqueta meta de tamaño de anuncio para una creatividad de 300x250

<meta name="ad.size" content="width=300,height=250">

Opcional: Configurar marcadores para la expansión

Existen varios métodos para configurar el comportamiento de los anuncios expandibles. Si necesita utilizar uno de estos métodos, colóquelo por encima del código de inicialización del Enabler que se indica más abajo. Estos métodos son:

  • Enabler.setExpandPixelOffsets(left:number, top:number, opt_expandWidth:number, opt_expandHeight:number)
    Establece los márgenes para los anuncios expandibles.
  • Enabler.setIsMultiDirectional(value:Boolean)
    Permite que el anuncio se expanda en más de una dirección.

  • Enabler.setStartExpand(startexpand:Boolean)
    Cuando el anuncio se carga, lo hace expandido en lugar de esperar a que alguien lo expanda.

    Puede consultar más información sobre estos métodos en el SDK de HTML5 de Studio.

Esperar a la inicialización del Enabler

No se debería ejecutar automáticamente nada en el anuncio hasta que el Enabler se haya inicializado. De este modo, se tiene la seguridad de que todos los componentes se han cargado correctamente y se puede acceder a los métodos del Enabler antes de que un usuario interactúe con el anuncio.

En el JavaScript, verifique que se ha inicializado el Enabler mediante el método isInitialized, que devuelve el valor "true" o "false". Si devuelve el valor "true", haga la llamada para iniciar su función; en este ejemplo, enablerInitHandler(). Si devuelve el valor "false", realice una llamada a una función alternativa que procese el evento INIT del Enabler.

// Si el valor es "true", inicie la función. Si el valor es "false", se procesa para INIT.
window.onload = feature() {
 if ( Enabler.isIniciad()) {
 enablerInitHandlerfalse
 } other {
 Enabler.addEventListener( studio.events.\r.INIT, enablerInitHandler); }
}

function enablerInitHandler() {
 // Iniciar la carga progresiva o la animación,
 // cargar sus recursos de imagen, llamar a los métodos del Enabler,
 // o incluir otros módulos de Studio.
}

Una vez que el Enabler se ha inicializado, puede empezar la animación, cargar los recursos de imagen, invocar métodos de seguimiento o incluir otros módulos de Studio.

Actualizar el Enabler

Cuando se lanza una nueva versión del Enabler, aparece una advertencia de que la versión del Enabler de su creatividad no está actualizada en la UI de Studio. Para actualizar a la última versión del Enabler, vuelva a cargar el recurso HTML principal de la creatividad.

¿Te ha resultado útil esta información?

¿Cómo podemos mejorar esta página?
Búsqueda
Borrar búsqueda
Cerrar búsqueda
Menú principal
10634931649563276245
true
Buscar en el Centro de ayuda
true
true
true
true
true
74220
false
false