Solo incluir las etiquetas script
que Google Analytics te proporciona no es suficiente para habilitar analytics cuando un usuario está navegando tu app con Turbolinks.
Necesitamos habilitar nuestra app para enviar analytics a google cada vez que Turbolinks carga, y quería compartir la solución que se me ocurrió para este problema. Antes de empezar, déjame compartir un descargo de responsabilidad:
No sé si esta es la mejor forma de resolver este problema, pero es lo que probé y funcionó bastante bien. Espero que también solucione tu problema. Ok, empecemos.
El primer paso es registrarte en google analytics y obtener tu tag. Si aún no lo tienes, sigue estas instrucciones.
El segundo paso es crear un partial (usualmente lo pongo en app/views/shared/_google_analytics.html.erb con el siguiente contenido:
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=YY-XXXXXXXXX-Z"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
</script>
Recuerda reemplazar YY-XXXXXXXXX-Z
con tu propio tag.
Ahora ve a tu(s) layout(s) y renderiza el partial dentro de la etiqueta head:
<head>
...
<%= render 'shared/google_analytics' %>
<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
...
Ahora puedes ir a tu archivo application.js
y agregar las siguientes líneas:
$(document).on("turbolinks:load", function() {
gtag('config', 'YY-XXXXXXXXX-Z', {'page_location': event.data.url});
})
Y otra vez, reemplaza YY-XXXXXXXXX-Z
con tu propio tag.
Eso es todo, ya terminaste. Si quieres probarlo recomiendo usar algo diferente a Firefox, ya que bloquea el script de Google Analytics por defecto, pero puedes deshabilitar esa función fácilmente.
¡Espero que esto ayude, gracias por leer!