Video con instrucciones para instalar Google Tag Manager en un sitio Web, siguiendo el nuevo formato de dos piezas de código. Pido disculpas por el audio. Ejemplo de instalación: header.php de un theme de Wordpress. Incluye tip para uso de dataLayer.
TRANSCRIPCIÓN:
Hola, mi nombre es Daniel Guajardo y les voy a enseñar cómo se instala Google Tag Manager en un sitio Web.
Muy simple, paso uno, tienen que ir a Google Tag Manager, que está en la URL http://tagmanager.google.com
Ahí tienen que ingresar con su cuenta de Google, en este caso un Gmail, y cuando se abre Tag Manager por primera vez, lo primero que les pide es que creen una cuenta.
Al crear la cuenta les pregunta cómo se debe llamar la cuenta, obviamente, tienen que elegir un nombre adecuado, después lo pueden cambiar eso es importante.
No es necesario que compartan información con Google de manera anónima, pero si quieren hacerlo, está bien, no va pasar nada malo.
Al presionar continuar, les va preguntar qué tipo de contenedor se va instalar en el sitio.
Primero ponen nombre al contenedor del sitio Web, y luego qué tipo de contenedor van a elegir.
En este caso vamos a usar el contenedor Web.
También hay contenedores para iOS y para Android, que requieren la instalación de un SDK en la aplicación; y ahora hay un contenedor para AMP, que es el HTML-amplificado, en algún momento del futuro les voy a explicar como se hace.
Después les dice que acepten los términos de servicio, obviamente si no los aceptan no pueden usar la herramienta, así que tienen que decir que bueno obligatoria mente. De todas maneras les recomiendo que lo lean, es una buena práctica leer las políticas de servicio.
Y una vez que aceptan aparece esto: una pequeña pantalla con dos piezas de código. Está dividida en dos partes, la primera se llama Script , que se instala en el <head>; y la siguiente es el NoScript que se instala después de <body>.
La principal diferencia es que el Script es un Javascript que llama a librerías desde Google, y la segunda parte es un Iframe donde se implementan algunas de esas librerías.
Es importante que estén las dos. He visto sitios que funcionan correctamente solo con el Script, pero al momento de validar al código no valida si no están las dos, así que recomiendo la instalación completa,.
Para el ejemplo voy a utilizar un theme de Wordpress, el típico que viene con Wordpress cuando uno lo instala.
Y para instalar GTM vamos al documento header.php
Que es el documento donde están todas las cabeceras del sitio y la gracia de esto es que una vez que se instala GTM una sola vez, queda instalado en todas las páginas del sitio y no es necesario instalarlo muchas veces en distintas páginas. Esa es la principal gracia de trabajar con Wordpress.
Este es el código fuente de header.php, son las principales treinta y algo líneas de código de Wordpress.
El código Script como dice la instrucción, se instala inmediatamente después de la apertura de <head>, ahí está marcado con una flecha. Yo simplemente copio y pego, no tengo que hacer nada más.
Importante, esto lo estoy editando en un bloc de notas. Es el Notepad++, que permite editar directamente el código fuente con formato. Por eso se ve con colores.
Ahora instalo el código NoScript, copié y pegué, después de <body>. No hay ninguna ciencia al respecto. Simplemente copié y pegué. Ahora lo que tengo que hacer es guardar y subir vía FTP al sitio Web. Y ya está instalado.
Después vía Tag Manager puedo instalar Analytics, códigos de Facebook, de Twitter, de AdWords, Double Click, de lo que necesiten.
Ahora, un tip importante, si van a usar dataLayer, que es una herramienta de Tag Manager, que no es obligatoria pero hay veces en que uno necesita usarlo, dataLayer tiene que estar instalado en ese punto, entre <head> y el código Script de Tag Manager.
De otra manera, Tag Manager no va a leer la data que está instalada dentro del dataLayer para que ustedes la puedan utilizar.
Eso es. Cualquier duda o consulta, déjenla en los comentarios del video.
Y pronto voy a tener una nueva transmisión explicando algo más acerca de Tag Maganer.
No hay comentarios:
Publicar un comentario