Natzir Turrado es Consultor SEO

Natzir Turrado

  • Sobre Mi
  • Artículos
    • SEO (Posicionamiento en Buscadores)
    • CRO (Conversión Web)
    • Analítica Web
  • Mi Curso SEO
  • LinkedIn
  • RSS
  • Twitter

647 50 39 47

hola@natzir.com

Estás aquí: Portada > Analítica Web > Tracking de vídeos de YouTube con Google Analytics

Tracking de vídeos de YouTube con Google Analytics

19 marzo, 2012 por Natzir Turrado

YouTube ya tiene por defecto un potente sistema de estadísticas llamado Youtube Insight para tener información sobre las reproducciones del vídeo y más información de interés (datos demográficos, horas de reproducción…). Y para las marcas que están pagando por su canal en YouToube además pueden integrar Google Analytics dentro del canal.

Pero, ¿qué hacen entonces lo que quieren saber qué pasa con los vídeos de YouTube que están insertados en su propia web? Pues bien, este tutorial va dedicado a aquellas personas que quieran hacer un tracking del vídeo de YouTube que tienen embebido dentro del propio sitio web mediante Google Analytics. De esta manera se podrá obtener una información muy valiosa y no estaremos publicando vídeos a ciegas, sin saber como se están consumiendo dentro de nuestro sitio, cuantos de nuestros usuarios que aterrizaron en el post lo vieron hasta el final, etc. Empecemos…

Tabla de contenidos

  • 1 Paso 1: Inserta el vídeo mediante el objeto SWFObject
  • 2 Paso 2: Introduce el tracking de eventos de Google Analytics
  • 3 Paso 3: Comprobar que el script y el vídeo funcionan
  • 4 Paso 4: Ver los resultados en Google Analytics
      • 4.0.1 Artículos Relacionados:

Paso 1: Inserta el vídeo mediante el objeto SWFObject

Por desgracia, la API de javascript no soporta los vídeos insertados con <Iframe> que es el actual método que YouTube nos da cuando queremos compartir el vídeo en nuestro sitio. Esto tiene solución, el único problema es que nos tocará trabajar un poco más, pero por lo menos de esta manera conseguiremos evitar el mensaje maldito de Internet Explorer de “Haga clic para activar este control”…

El código a insertar para el vídeo es el siguiente:

<script type="text/javascript" src="swfobject.js"></script>
  <div id="ytapiplayer">
    Necesitas Flash player 8+ y el JavaScript habilitado para ver este vídeo.
  </div>
<script type="text/javascript">

 var params = { allowScriptAccess: "always" };
 var atts = { id: "myytplayer" };
 swfobject.embedSWF("http://www.youtube.com/v/VIDEO_ID?enablejsapi=1&playerapiid=ytplayer",
                    "ytapiplayer", "425", "356", "8", null, null, params, atts);
 //Espacio reservado para introducir el código de Tracking de Eventos del paso 2
</script>

El VIDEO_ID es el identificador, por ejemplo el ID de este vídeo http://www.youtube.com/watch?v=pqjlYJXTakA será pqjlYJXTakA. En rojo os he puesto algo muy importante que tenéis que añadir ya que sin eso el tracking no funcionará. El primer parámetro “enablejsapi=1″  lo que hace es habilitar la API javascript dentro del SWF con un objeto de tipo YouTuble Player “ytplayer” que es el segundo parámetro. Por último el 425 y el 356 es el ancho y el alto respectivamente, parámetros que podéis cambiar sin ningún problema. Si queréis profundizar sobre este código os dejo la documentación de la API del reproductor JavaScript de YouTube.

Paso 2: Introduce el tracking de eventos de Google Analytics

Este paso es un poco personal y podemos recoger los eventos que queramos. En este caso voy a hacer que recoja los eventos de vídeo finalizado, en reproducción y vídeo pausado. Pero todavía podéis recoger un evento en buffer y en cola de vídeos, tal y como nos explica en la documentación de la API que os he adjuntado anteriormente dentro de la sección de eventos. Sería cuestión de añadirlos al switch case con el número adecuado.

Éste es el código que sigue los eventos y que hay que introducir dentro del script anterior donde está la frase verde (esa frase se puede borrar):

function onYouTubePlayerReady(playerId) {
        ytplayer = document.getElementById("videoPlayer");
        ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
    } 

function onytplayerStateChange(newState) {
   var currentState = ytplayer.getPlayerState()
   switch(currentState){
      case 0: // Video finalizado
        _gaq.push(['_trackEvent','Titulo de la pagina', 'Nombre del video', 'Visto']);
        break;
      case 1: // Video visualizandose
        _gaq.push(['_trackEvent','Titulo de la pagina', 'Nombre del video', 'Viendose']);
        break;
      case 2: //Vídeo pausado
        _gaq.push(['_trackEvent','Titulo de la pagina', 'Nombre del video', 'Pausado']);
        break;
      default:
        break;
   }
}

La primera función onYouTubePlayerReady lo que hace es ejecutarse cuando el reproductor está preparado y la API que hemos llamado antes esté lista para recibir llamadas. Dentro de esta función ponemos el modo escucha para poder capturar los eventos que hemos decidido recoger dentro de la segunda función onytplayerStateChange.

Paso 3: Comprobar que el script y el vídeo funcionan

Una vez que hayamos introducido todo este script donde queramos poner el vídeo,  comprobamos que esté todo correcto cargando el vídeo y viendo que funcionan los botones. Este paso lo podemos hacer dentro del Code Playground de Google.

Paso 4: Ver los resultados en Google Analytics

Pasadas las 24 horas de rigor, podremos empezar a ver los resultados dentro de la sección de eventos de Google Analytics. A partir de aquí ya tenendremos la información necesaria para ver qué hacen los usuarios con nuestros vídeos, en qué parte lo pausan, cuantos lo miran enteros…

Como paso opcional podemos configurar los eventos como objetivos y con todo esto podremos medir cualquier cosa que queramos segmentando para sacar los valiosos insights que necesitamos.

Nota: Este tutorial está hecho para funcionar con la versión asíncrona de Google Analytics.

Artículos Relacionados:

  • Medición del impacto de nuestra presencia en las redes sociales
  • Google Tag Manager: Todo lo que necesitas saber
  • Ley de Cookies y Google Analytics
  • Descubre quién enlaza tus contenidos desde Google Analytics

Comentarios en "Tracking de vídeos de YouTube con Google Analytics"

  1. Natzir dice

    28 mayo, 2012 at 18:44

    Hola Marta,

    Sí que es posible, para ello necesitarás utilizar la api de Vimeo:

    http://developer.vimeo.com/player/js-api

    Saludos!

    Responder
  2. Anónimo dice

    28 mayo, 2012 at 17:35

    Hola¡¡¡¡ Tu artículo me ha parecido muy útil de cara a los videos de Youtube, en mi caso estoy buscando cómo medir con Google Analytics los videos embebidos de vimeo. Veo que estás muuucho más puesto en estos temas que yo ejeje y agradecería que me dijeras si es posible y si conoces la manera de hacerlo. Muchas gracias de antemano¡¡¡¡

    Responder
  3. Luis Muñoz dice

    28 junio, 2012 at 19:08

    Saludos, me ha parecido muy útil tu artículo, pero tengo una duda/problema. Los vídeos los he incluido como iframe pues necesitamos que los vídeos se vean en tablet y móviles de apple. ¿sabes si hay alguna forma de hacer tracking a estos vídeos aunque sea complicado.?
    Gracias

    Responder
  4. Natzir dice

    23 agosto, 2012 at 23:35

    Hola Luis,

    Tienes que habilitar el tracking entre dominios (para pasar las cookies) si cargas el contenido desde otro sitio y configurar lo siguiente:
    https://developers.google.com/analytics/devguides/collection/gajs/gaTrackingSite#trackingIFrames

    Responder
  5. Daniel dice

    23 enero, 2013 at 13:22

    EPIC WIN #Analytics

    Responder
  6. Victorio dice

    27 mayo, 2013 at 13:30

    Hola, quisiera saber como podria incluir el analytics para controlar la duraccion de streaming de una emision en directo, me refiero a controlar el tiempo que la gente esta oyendo la emision.

    El codigo que tengo para reproducir es:

    var so = new SWFObject(“nativeradio2small.swf”, “nativeradio2small”, “200″, “50″, “10″, “#cccccc”);
    so.addParam(“scale”, “noscale”);
    so.addVariable(“swfcolor”, “B89E7A”);
    so.addVariable(“swfwidth”, “200″);
    so.addVariable(“swfradiochannel”, “Nombre Programa”);
    so.addVariable(“swfstreamurl”, “url del fichero”);
    so.addVariable(“swfpause”, “0″);
    so.write(“flashcontent1″);

    Esto es audio, pero no tengo claro si funciona diferente, te agradecere una ayudita..

    Gracias.

    Responder
  7. Anónimo dice

    29 octubre, 2013 at 19:52

    Hola Natzir,
    Muy bueno el post, me gustaría saber si me es posible trackear videos que no son subidos por mí, simplemente son enlazados desde mi sitio web con la api js activada. Saludos.

    Responder
  8. Natzir Turrado dice

    2 noviembre, 2013 at 19:06

    Hola Francisco!

    ¿Es lo que he puesto en el post no? quizás no he entendido tu pregunta.

    Responder
  9. Anónimo dice

    7 noviembre, 2013 at 08:10

    Gracias, me has respondido, tenía la duda si esto es posible para cualquier vídeo o sólo para vídeos de los cuales tú eres el propietario en youtube (están en tu canal).
    En la api de youtube analytics no he encontrado ninguna información al respecto.

    Gracias de nuevo.

    Responder
  10. Dariane dice

    4 junio, 2014 at 01:02

    Hola Natzir, tengo algunas dudas con el ID de la cuenta de Google Analytics en mi canal de Youtube, puedo insertar lo mismo de mi página web ?
    Lo que paso fue que inserte el mismo ID, solo me di cuenta porque mis visitas directas aumentaron muchísimo y ya realizando una búsqueda avanzada descobri que cuando agrego una dimension secundaria de Hostname veo que son de Youtube, al principio imaginé que pudieran ser visitas referidas de Youtube a mi sitio (que podria ser un error de los channel group), pero hablando con un experto allá me dijeron que son las visitas al canal de Youtube en el cual me recomendaron a implementar un ID distinto, vendo tu articulo ahora me quedo con dudas de cual ID implementar.

    Responder
  11. Bruno L. dice

    11 marzo, 2016 at 12:27

    Buen artículo, enhorabuena.

    Tengo una duda ¿Se contabilizan las visitas en el contador del vídeo en Youtube?

    ¡Gracias!

    Responder

Dejar un comentario en "Tracking de vídeos de YouTube con Google Analytics" Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.