Hay una nueva versión de esta publicación para GTM V2 aquí.
(Última actualización en junio de 2014) Me he enamorado de Análisis common y Administrador de etiquetas de Google. Juntos forman una herramienta increíblemente poderosa para los profesionales del advertising. En la mayoría de los casos, ya no necesito publicar recomendaciones a mi cliente para otra revisión de la plantilla de página, ya que con el administrador de etiquetas implementado, puedo simplemente agregar código personalizado a través del panel de administración. Agregue a eso el poder de Common Analytics con su protocolo de medición ultrasensible y la capacidad de crear dimensiones y métricas personalizadas, ¡y listo! Estoy en un lugar feliz.
En esta publicación, lo guío a través de un breve recorrido de desarrollo de JavaScript sobre cómo utilizar datos meteorológicos como una dimensión personalizada en Analytics de su sitio. Sólo necesita tener instalados Common Analytics y Google Tag Supervisor en su sitio.
incógnita
El boletín a fuego lento
Suscríbete al Boletín a fuego lento para recibir las últimas noticias y contenido de Simo Ahava en su bandeja de entrada de correo electrónico.
El resultado remaining
Esto es lo que obtienes:
Como puede ver, he creado un informe personalizado que muestra las visitas, las páginas vistas y las tasas de conversión (Páginas/Visita > 2) para diversas condiciones climáticas. Este informe demuestra de manera inequívoca, con una clara muestra de causalidad, que cuando llueve, es más possible que la gente se convierta. Debería dirigirme más al público británico…
Crea una nueva etiqueta en GTM
- Nombra la etiqueta “API meteorológica”
- Elegir Etiqueta HTML personalizada como el tipo de etiqueta
- Ingrese el siguiente código en el campo HTML (¡Nota! ¡Necesitas cargar jQuery para que esto funcione! Consulte aquí para obtener más información):
<script>
var lat = geoplugin_latitude();
var lon = geoplugin_longitude();
var climate = "";
var weatherAPI = "http://api.openweathermap.org/knowledge/2.5/climate?lat="+lat+"&lon="+lon;
$.ajax({
sort : "POST",
dataType : "jsonp",
url : weatherAPI+"&items=metric&callback=?",
async : true,
success : perform(knowledge) {
climate = knowledge.climate(0).principal;
dataLayer.push({"climate": climate});
},
error : perform(errorData) {
console.log("Error whereas getting climate knowledge :: "+errorData.standing);
},
full : perform() {
dataLayer.push({"occasion": "weatherDone"});
}
});
script>- Agregue una regla para activar la etiqueta en cada página ({{url}} coincide con RegEx .*)
Esto es lo que está pasando.
Primero, se llama a un par de funciones externas de JavaScript para recuperar la longitud y latitud del visitante utilizando sus direcciones IP. estoy usando el free of charge geoPlugin servicio. Puede cargarlo en su sitio agregando en tu plantilla.
Recuerde cargar este script ANTES de que se ejecute la API meteorológica. Lo mejor es ponerlo en of your web page template. If you need, you too can put the script load as the primary line of the customized HTML tag you simply created.
Subsequent, I take advantage of the API of OpenWeatherMap to retrieve the climate knowledge for the latitude and longitude I acquired within the earlier step.
Within the AJAX name, I make an asynchronous name to the API, requesting the info in JSONP (because it originates from a distinct area than mine). If the decision is profitable, I search for the /climate/principal/ node, because it has a pleasant, quick description of the climate within the space (e.g. “Clear”). I then push the string into the info layer.
Lastly, whether or not the API name is a hit or not, I push an occasion “weatherDone” into the info layer. That is used to verify the API name is completed earlier than the Common Analytics tag is fired (see under).
Create new customized dimension in GA
- Go to the admin panel of your Google Analytics web site
- Underneath Property, select Customized Definitions / Customized Dimensions
- Create a brand new Customized Dimension with the identify “Climate”
- Scope the brand new dimension to Session
- Set the dimension as Lively
- Click on Save
- Make observe of the index of the brand new dimension
Right here you create a brand new dimension in Google Analytics and set it energetic. It's essential to make observe of the dimension index, since you may be referring to this in a short time.
Create new macro in GTM
- In Google Tag Supervisor, go to your container and click on New Macro
- Nombra la macro "Tiempo"
- Establecer tipo de macro como variable de capa de datos
- Escriba "clima" en el nombre de la variable de la capa de datos
- Haga clic en Guardar
Crea la macro para acceder a la cadena meteorológica que insertó en la capa de datos hace un par de pasos.
Edita tu etiqueta GA
(¡NOTA! Te sugiero que eches un vistazo esta publicación para obtener detalles sobre cómo enviar datos meteorológicos utilizando un evento sin interacción. De esta manera, sus valiosas páginas vistas nunca se verán comprometidas si el script meteorológico no funciona).
Pasos:
- Vaya a la etiqueta que rastrea sus páginas vistas y las envía a GA
- Elija más configuraciones
- Elija dimensiones personalizadas
- Agregue el número de índice de su nueva dimensión en el campo Índice
- En el campo Dimensión, haga clic en {{+macro}} y elija la macro que acaba de crear.
- Edite la regla de disparo y agregue la condición. {{evento}} es igual a tiempoDone
- guardar la etiqueta
- Crear una nueva versión de contenedor
- Publicar la nueva versión del contenedor.
Aquí envía una nueva dimensión personalizada con la página vista y obtiene su contenido de la variable de la capa de datos que insertó en la capa de datos durante la llamada a la API meteorológica. Dado que las llamadas son asincrónicas, deberá asegurarse de que la etiqueta UA se energetic solo después de que se haya realizado la llamada a la API meteorológica. Esto se hace esperando el evento. tiempoHecho para ser insertado en la capa de datos.
Asegúrate de que todo funcione
- Visita tu sitio
- Eche un vistazo a las solicitudes que envía su sitio mediante insecto de fuego o algo comparable
Disfrutar
Creé un nuevo informe personalizado en GA, con visitas, páginas vistas y tasa de conversión como métricas, y mi nueva dimensión personalizada como dimensión.
Tenga en cuenta que la nueva dimensión puede tardar algún tiempo en comenzar a extraer datos. Si Firebug le cube que los datos meteorológicos se envían junto con los datos de su página vista, está bien.
Esto se podría hacer de muchas maneras diferentes, pero elegí JavaScript simplemente para este prototipo rápido. Estoy bastante satisfecho con el resultado y, aunque hago un par de llamadas externas, la velocidad de carga de la página no es un problema. Siempre existe el riesgo con las secuencias de comandos asincrónicas de que el usuario sea lo suficientemente rápido como para interactuar con el sitio antes de enviar la página vista, pero no creo que eso sea un problema con estas secuencias de comandos livianas.
Se me ocurren varias aplicaciones interesantes para esta API meteorológica, pero las dejaré a tu imaginación.
Google Tag Supervisor y Common Analytics hacen un excelente trabajo al brindar un alto valor a los profesionales del advertising. Me encanta el hecho de que no necesitas complicarte con la plantilla de página y puedes probar y obtener una vista previa de tus etiquetas tanto como quieras antes de publicarlas.
EDITAR: Edité las reglas de activación para que la etiqueta UA se produzca solo después de que se haya completado la llamada a la API meteorológica.
EDITAR II: Tenga en cuenta que necesitas cargar jQuery para que esto funcione! El $.ajax ¡La llamada es una función jQuery! Entonces, cargue el recurso jQuery en el del método de su página (para que se cargue antes que el contenedor GTM) O tenga lo siguiente como primera línea de la etiqueta HTML personalizada:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js">script>EDITAR III: Asegúrese de revisar mi publicación sobre cómo asegurarse de que la API meteorológica se sondee justo una vez por visita. Esto mejorará el rendimiento del sitio y disminuirá la carga de la API externa.
EDITAR IV: Finalmente, vea esta publicación en enviando dimensiones personalizadas con eventos en lugar de páginas vistas para la versión óptima del código anterior.