Añadir un temporizador

Un temporizador le permite medir la duración de una acción realizada en una creatividad; por ejemplo, la cantidad de tiempo que un usuario emplea en un juego.

Si va a utilizar un temporizador, deberá decidir con qué interacciones quiere que este se detenga. Por ejemplo, si quiere saber el tiempo que los usuarios pasan jugando a un juego, el temporizador debería detenerse cuando hacen clic en un botón de cierre y también cuando hacen clic en cualquier punto de salida. Asegúrese de detener el temporizador cuando dejen de jugar o cuando abandonen el juego.

Añadir un temporizador usando Google Web Designer

1. Vaya al panel "Eventos" y haga clic en el botón más (+) para asignar un evento al objeto que quiera.
2. En la ventana emergente de los eventos, seleccione como origen la instancia del objeto.
3. Seleccione Área de pulsación y, luego, Toque o clic.
4. En la misma ventana, vaya al panel "Acción", haga clic en Anuncio de Google y después en Iniciar temporizador.
5. Vaya al panel "Receptor" y haga clic en gwd-ad.
6. Vaya al panel "Configuración" e introduzca el ID de métrica que quiera para que se haga un seguimiento. Recuerde el ID que introduzca en este campo, ya que deberá usarlo de nuevo cuando detenga el temporizador.
7. Repita los pasos anteriores para detener el temporizador y use el mismo ID de métrica que ha introducido antes.
8. Haga clic en Guardar. El código de seguimiento se añade automáticamente en función de la información que proporcione, por lo que no es necesario que revise y edite el código fuente después.
9. Previsualice el anuncio en el navegador que prefiera.
10. Publique el anuncio en Studio.

Añadir un temporizador mediante cualquier editor de HTML

1. Cree elementos con dos botones en la creatividad mediante etiquetas <div>. Cree los elementos en el archivo HTML y asígneles un estilo en el archivo CSS. Después, asigne diferentes ID para start-timer y stop-timer.

   Objeto de etiqueta <div> de ejemplo en el archivo HTML:

   <div id="start-timer">START TIMER</div>
<div id="stop-timer">STOP TIMER</div>

   Ejemplo de aplicación de estilo y selector de ID en el archivo CSS:

   #start-timer {
       position: absolute;
       width: 130px;
       height: 20px;
       top: 60px;
       left: 25px;
       cursor: pointer;
   }
   
   #stop-timer {
       position: absolute;
       width: 130px;
       height: 20px;
       top: 85px;
       left: 25px;
       cursor: pointer;
   }

2. Inicie un temporizador con el siguiente método de JavaScript: Enabler.startTimer(timerId:String);.
3. Para detener un temporizador en JavaScript, use el método siguiente: Enabler.stopTimer(timerId:String);
   • timerId es el nombre del temporizador que aparecerá en los informes. Utilice un nombre que le ayude a asociar el temporizador a la acción de la que está haciendo un seguimiento. Puede cambiar el nombre de ese temporizador cuando suba la creatividad a Studio o la trafique en Campaign Manager 360.
   • Para detener el temporizador, el valor timerId utilizado en stopTimer debe ser el mismo que el ID utilizado en startTimer. En el ID se distingue entre mayúsculas y minúsculas, por lo que hay que asegurarse de indicar exactamente la misma cadena.
   • Para utilizar estos métodos, primero debe incluir e inicializar la biblioteca Enabler.

Fragmento de código

function startTimerHandler(e) {
    Enabler.startTimer('My Timer');
}
document.getElementById('start-timer').addEventListener('click',
startTimerHandler, false);

function stopTimerHandler(e) {
    Enabler.stopTimer('My Timer');
}
document.getElementById('stop-timer').addEventListener('click',
stopTimerHandler, false);