ga.js es una biblioteca de JavaScript para medir cómo interactúan los usuarios con tu sitio web. Esta es una biblioteca heredada. Si estás comenzando a usar Google Analytics, debes usar la biblioteca de seguimiento más reciente, analytics.js.
Guía de inicio rápido del código de seguimiento
El fragmento de Analytics es un pequeño fragmento de código JavaScript que se pega en tus páginas. Para activar el seguimiento de Google Analytics,
inserta ga.js en la página. Para usarlo en tus páginas, copia el siguiente fragmento de código y reemplaza UA-XXXXX-X por el ID de tu propiedad web.
Pega este fragmento en la página de la plantilla de tu sitio web para que aparezca antes de la etiqueta de cierre </head>.
Si necesitas hacer algo más que el seguimiento básico de páginas, consulta la referencia de seguimiento para obtener una lista de los métodos disponibles en la API y la Guía de uso para obtener detalles sobre el uso de la sintaxis asíncrona. Para obtener instrucciones paso a paso sobre cómo configurar el seguimiento, consulta el artículo del Centro de ayuda sobre cómo configurar el seguimiento.
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXX-X']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
El fragmento anterior representa la configuración mínima necesaria para realizar un seguimiento de una página de forma asíncrona. Utiliza _setAccount para establecer el ID de propiedad web de la página y, luego, llama a _trackPageview para enviar los datos de seguimiento a los servidores de Google Analytics.
Importante: Si actualizas tus páginas del fragmento tradicional a la versión asíncrona más reciente, primero debes quitar el fragmento de seguimiento existente. No recomendamos usar ambos fragmentos juntos en la misma página. Para obtener instrucciones de migración, consulta Migra a datos asíncronos.
Cómo funciona la sintaxis asíncrona
El objeto _gaq es lo que hace posible la sintaxis asíncrona.
Actúa como una cola, que es una estructura de datos primero en entrar, primero en salir, que recopila llamadas a la API hasta que ga.js esté listo para ejecutarlas. Para agregar algo a la cola, usa el método _gaq.push.
Para enviar una llamada a la API a la cola, debes convertirla de la sintaxis de JavaScript tradicional en un array de comandos. Los arrays de comandos son simplemente arrays de JavaScript que cumplen con un formato determinado. El primer elemento de un array de comandos es el nombre del método de objeto de seguimiento al que deseas llamar. Debe ser una cadena. El resto de los elementos son los argumentos que deseas pasar al método de objeto de seguimiento. Estos pueden ser cualquier valor de JavaScript.
El siguiente código llama a _trackPageview() con la sintaxis tradicional:
var pageTracker = _gat._getTracker('UA-XXXXX-X');
pageTracker._trackPageview();
El código equivalente en la sintaxis asíncrona requiere dos llamadas a _gaq.push.
_gaq.push(['_setAccount', 'UA-XXXXX-X']); _gaq.push(['_trackPageview']);
En la sintaxis asíncrona, la creación del objeto de seguimiento está implícita, pero aún necesitamos una manera de configurar el ID de propiedad web para la herramienta de seguimiento. Se agregó el método _setAccount para proporcionar esta función. Todos los demás métodos de objetos de seguimiento son los mismos en el seguimiento asíncrono y tradicional. Solo la sintaxis es diferente.
Para obtener más información sobre la sintaxis asíncrona, consulta la referencia de seguimiento para el método _gaq.push.
Seguimiento con controladores de eventos HTML
La sintaxis del seguimiento asíncrono también debe usarse desde los controladores de eventos del DOM. Por ejemplo, el siguiente botón genera un evento cuando se hace clic en él.
<button onclick="_gaq.push(['_trackEvent', 'button3', 'clicked'])"></button>
Incluso si se hace clic en este botón antes de que el navegador termine de cargar ga.js, el evento se capturará y, finalmente, se ejecutará. Si se utiliza el seguimiento tradicional, es posible que el navegador genere una excepción en esta situación.
Envía funciones a la cola
Además de los arrays de comandos, también puedes enviar objetos de funciones a la cola de _gaq. Las funciones pueden contener cualquier código JavaScript arbitrario y, al igual que los arrays de comandos, se ejecutan en el orden en que se envían a _gaq. Esta técnica es útil para llamar a las APIs de seguimiento que muestran valores. Por ejemplo, en el siguiente código, se compila una URL de vinculador y se establece la propiedad href para un vínculo con el resultado.
_gaq.push(function() {
var pageTracker = _gat._getTracker('UA-XXXXX-X');
var link = document.getElementById('my-link-id');
link.href = pageTracker._getLinkerUrl('http://example.com/');
});
En el ejemplo anterior, se usa _gat para crear un objeto de seguimiento, pero como está asignado a una variable local, el código fuera de la función no puede usarlo. Si bien esto es aceptable, puedes usar el método _gat._createTracker para crear un objeto permanente y accesible de forma global.
En el siguiente código, se muestra cómo funcionaría.
_gaq.push(function() {
var pageTracker = _gat._createTracker('UA-XXXXX-X', 'myTracker');
var link = document.getElementById('my-link-id');
link.href = pageTracker._getLinkerUrl('http://example.com/');
});
_gaq.push(['myTracker._trackPageview']);
En el ejemplo anterior, se crea una herramienta de seguimiento asíncrona dentro de la función y, luego, se hace referencia a ella por su nombre en el array de comandos.
También es posible el caso de uso opuesto. Por ejemplo, si necesitas usar un objeto de seguimiento asíncrono creado a través de un array de comandos enviado anteriormente, utiliza el método _gat._getTrackerByName. En el siguiente código, se demuestra cómo funciona.
_gaq.push(['myTracker._setAccount', 'UA-XXXXX-X']);
_gaq.push(function() {
var pageTracker = _gat._getTrackerByName('myTracker');
var link = document.getElementById('my-link-id');
link.href = pageTracker._getLinkerUrl('http://example.com/');
});
Un solo empuje, varios comandos
En lugar de escribir _gaq.push(...) para cada llamada, puedes enviar todos los comandos a la vez. En el siguiente código, se muestra esta técnica.
_gaq.push( ['_setAccount', 'UA-XXXXX-X'], ['_setDomainName', 'example.com'], ['_setCustomVar', 1, 'Section', 'Life & Style', 3], ['_trackPageview'] );
Esto funciona porque el método _gaq.push imita al método Array.push, que permite enviar varios elementos con una invocación.
Cómo dividir el fragmento
Si prefieres colocar el fragmento de Analytics en la parte inferior de la página, debes saber que no es necesario colocar todo el fragmento allí.
Aún puedes conservar la mayoría de los beneficios de la carga asíncrona si divides el fragmento por la mitad: mantén la primera mitad en la parte superior de la página y mueve el resto a la parte inferior. Como la primera parte del fragmento de seguimiento tiene poco o ningún efecto en el procesamiento de la página, puedes dejar esa parte en la parte superior y colocar la parte del fragmento que inserta ga.js en la parte inferior.
Una página con el fragmento asíncrono dividido por la mitad podría verse así:
<html>
<head>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXX-X']);
_gaq.push(['_trackPageview']);
</script>
</head>
<body>
<p>Page Content</p>
<script src="some_random_script.js"></script>
<p>Page Content</p>
<script type="text/javascript"> (function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>
Ambos fragmentos de código deben unirse a sus propias etiquetas de secuencia de comandos, pero solo se deben mover a la parte inferior las seis últimas líneas del fragmento asíncrono original. Todas las líneas que envían métodos a _gaq pueden permanecer en la parte superior.
Cómo evitar errores comunes
Cuando uses la sintaxis asíncrona o tradicional, ten en cuenta lo siguiente:
- Los nombres de los métodos distinguen mayúsculas de minúsculas.
Si usas un nombre de método sin el uso de mayúsculas adecuado, tus llamadas de método no funcionarán. Ejemplos:_gaq.push(['_trackpageview']); // bad _gaq.push(['_trackPageview']); // good
- Usa los nombres de método correctos.
Si su seguimiento no funciona correctamente, asegúrese de estar usando el nombre correcto para el método. Ejemplos:_gaq.push(['_setDomain', 'example.com']); // bad _gaq.push(['_setDomainName', 'example.com']); // good
- Solo las strings se deben pasar entre comillas. Los demás tipos no se deben dejar entre comillas.
Cualquier valor que no sea una string, como valores booleanos, literales de objeto, funciones o arreglos, se debe pasar sin comillas. Usa solo comillas cuando pases algo que deba interpretarse como una string. Si migras desde la sintaxis tradicional, cualquier parámetro de función que se haya pasado sin comillas debe permanecer sin comillas en la sintaxis asíncrona. Ejemplos:_gaq.push(['_setAllowLinker', 'false']); // bad _gaq.push(['_setAllowLinker', false]); // good
- Asegúrate de que las strings no contengan espacios en blanco al inicio ni al final.
Ejemplos:_gaq.push(['_setAccount', ' UA-65432-1']); // bad _gaq.push(['_setAccount', 'UA-65432-1']); // good
Inhabilita el seguimiento
En algunos casos, es posible que sea necesario inhabilitar el código de seguimiento de Google Analytics en una página sin tener que quitar el fragmento de código. Por ejemplo, puedes hacerlo si la política de privacidad de tu sitio incluye la posibilidad de que un visitante inhabilite el seguimiento de Google Analytics.
El fragmento de seguimiento ga.js ahora incluye una propiedad de ventana que, cuando se establece en true, inhabilita el envío de datos a Google Analytics.
Cuando Google Analytics intenta establecer una cookie o enviar datos
a los servidores de Google Analytics, verificará si esta
propiedad está configurada como true. Si es así, tendrá
el mismo efecto que si el visitante tuviera instalado el
complemento del navegador para inhabilitar Google Analytics.
Para inhabilitar el seguimiento, establece la siguiente propiedad de ventana en true:
window['ga-disable-UA-XXXXXX-Y'] = true;
El valor UA-XXXXXX-Y corresponde al ID de propiedad web en el que deseas inhabilitar el seguimiento.
Esta propiedad de ventana se debe configurar antes de llamar al código de seguimiento. Esta propiedad se debe establecer en cada página en la que deseas inhabilitar el seguimiento de Google Analytics. Si la propiedad no se establece o se establece como falsa, el seguimiento funcionará como de costumbre.
Por ejemplo, si el código de seguimiento de Google Analytics en una página incluye lo siguiente:
_gaq.push['_setAccount', 'UA-123456-1']
Si quieres inhabilitar el código de seguimiento para que no pueda configurar cookies ni enviar datos a Google Analytics, debes utilizar el siguiente código antes de llamar al código de seguimiento:
window['ga-disable-UA-123456-1'] = true;
Si usas varias herramientas de seguimiento en una página con varios IDs de propiedad web, debes establecer la variable window['ga-disable-UA-XXXXXX-Y'] equivalente en true para cada propiedad web a fin de inhabilitar completamente el seguimiento de Google Analytics en esa página.
Ejemplo
A continuación, se muestra un ejemplo simple de una parte del código que puedes usar para ofrecer la funcionalidad de inhabilitación a los usuarios.
Primero, agrega un nuevo vínculo HTML a tu sitio para ejecutar la lógica de inhabilitación:
<a href="javascript:gaOptout()">Click here to opt-out of Google Analytics</a>
Luego, agrega el siguiente fragmento antes del fragmento ga.js. Asegúrate de reemplazar el valor de gaProperty de UA-XXXX-Y por la propiedad que se usa en tu sitio.
Este es el mismo valor que pasas al comando _setAccount.
<script>
// Set to the same value as the web property used on the site
var gaProperty = 'UA-XXXX-Y';
// Disable tracking if the opt-out cookie exists.
var disableStr = 'ga-disable-' + gaProperty;
if (document.cookie.indexOf(disableStr + '=true') > -1) {
window[disableStr] = true;
}
// Opt-out function
function gaOptout() {
document.cookie = disableStr + '=true; expires=Thu, 31 Dec 2099 23:59:59 UTC; path=/';
window[disableStr] = true;
}
</script>
Cuando un usuario haga clic en el vínculo HTML de inhabilitación, se ejecutará la función gaOptout personalizada. Establecerá una cookie durante mucho tiempo en el futuro e inhabilitará la recopilación de datos de analytics.js.
Cuando un usuario regrese a este sitio, la secuencia de comandos anterior comprobará si se estableció la cookie de inhabilitación. Si es así, también se inhabilitará la recopilación de datos de analytics.js.
Fuerza SSL (HTTPS)
Para forzar a Google Analytics a enviar datos siempre a través de SSL, incluso desde páginas no seguras (HTTP), usa el método
_gat._forceSSL, como en este ejemplo:
_gaq.push(['_setAccount', 'UA-12345-1']); _gaq.push(['_gat._forceSSL']); // Send all hits using SSL, even from insecure (HTTP) pages. _gaq.push(['_trackPageview']);