fireface47

Voy a explicarte cómo puedes instalar
Google Tag Manageren WP y en cualquier web.

Y para eso nada mejor que veas cómo lo he hecho mismo pasito a pasito en este blog, o bien lo que es exactamente lo mismo, con el mimo y el cariño que ya imaginarás que le he puesto para dejarlo todo bien configuradito y funcionando. 😊

¡Vamos al lío!

La verdad es que me arrepiento de no haber publicado este tutorial mucho antes por el hecho de que, además de asistir a otros, me hubiese servido para instalar Google Tag Manager en mi weblog hace cierto tiempo y medir mejor las estratetgiasque aplico al blog…

Y es que ahora que lo tengo puedo decirte que es simple y llanamente BESTIAL

Tranqui que ahora entenderás por qué. Como afirmó
Jack el destripador, vayamos por partes…

🏷️ ¿Qué es Google Tag Mánager?

GTM o bien eles un sistema fácil y
gratuitobasado en «etiquetas» o bien
tagscon las que puedes
medir y examinar todo cuanto pasaen tu web o blog (incluso en su versión AMP) o bien en tu aplicación de móvil.

Todas estas «etiquetas» se añaden a lo que se llama el «contenedor» o
container, un fragmento de código HTML/JavaScript que será
el único que tendrás que añadiren tu página web, blog o Aplicación.

En mi caso, desde la web de Google Tag Manager he creado un contenedor llamado miposicionamientoweb.es (sí, soy muy original, qué pasa) y solo he tenido que añadir a este blog el código HTML/JavaScript
de ese contenedor.

Luego de manera directa desde la web de Google Tag Mánager
he añadido a mi contenedor etiquetaspara, por ejemplo, ver enel tráfico del weblog, saber en qué links se hace click, cuándo se hace scroll, hacer tests A/B, etc.

Y repito, no he tenido que añadir nada más en mi weblog, por el hecho de que el contenedor ya se encarga
automáticamente de meter el código que haga faltapara que funcionen todas y cada una esas etiquetas.

¡No me digas que no mola! 😁

🏷️ ¿Para qué sirve Google Tag Mánager?

Pues Google Tag Manager
sirve para conectar una web o bien una aplicación con herramientas de todo tipode forma rápida y fácil merced a su sistema de etiquetas.

Y estas herramientas pueden ser de: analítica web, medición de campañas de marketing digital (anuncios patrocinados, remarketing…), optimización de la experiencia de usuario, mapas de calor, tests A/B, y un largo etc.

Estos son solo ciertos ejemplos deque puedes utilizar con etiquetas a través de Google Tag Manager:

➤:herramienta de analítica web (la que he conectado en GTM para este weblog y que voy a explicarte cómo punto por punto)

➤:herramienta para lanzar campañas de anuncios patrocinados en búsquedas de Google (SEM), anuncios de display, de vídeo, de aplicaciones móviles, etc.

➤:herramienta avanzada y completísima para gestionar campañas de publicidad digital de todo tipo y al detalle.

➤:herramienta para la optimización de la experiencia de usuario con testing A/B, ensayos, etc. (¡Esta debo probarla!)

➤ Etcétera, etc…

Ya te puedes imaginar que este sistema de etiqueta facilita las cosas una barbaridad, pues no debes andar metiendo un montón de códigos (HTML, JavaScript, JSON, etc.) toda vez que desees usar alguna de estas herramientas en tu página web.

Y si eres de los que además precisa que sea un desarrollador el que meta todos estos códigos, imagínate ahora que solo tendrá que meter el código del contenedor y listo. 🙌

Te explico todo esto por el hecho de que soy de los que piensa que para saber bien cómo se usa Google Tag Manager, primero hay que comprender
qué es y para qué sirve.

Y esto se puede extrapolar a prácticamente cualquier cosa; no te pase como a mi padre que un día me vino con un lector de ebooks y me afirmó que aquello no funcionaba bien, que la tele no cambiaba de canal…

Y ahora que sabemos qué es y para qué sirve, ¡vamos al lío con el
cómo se usa! 😃

💻 Cómo instalar Google Tag Manager en WordPress

En verdad estos pasos te valen prácticamente para cualquier clase de web o bien plataforma que uses pues simplemente se trata de meter un fragmento de código en el código de tu web,
sea del tipo que sea.

Pero he querido centrarme en Wordpress pues es lo que empleo yo en este blog, así de sencillo. 😊

1) La primera cosa que tenemos que hacer es entrar eny loguearnos con nuestro correo y contraseña de Google.

Haz click en el botón
Siguiente.

2) Si todavía no tienes ninguna cuenta creada, lo primero que te pedirá es
añadir una cuenta nuevacon un nombre y un país.

Haz clic en el botón
Continuar.

3) Ahora toca configurar el «contenedor» que vas a añadir a tu página web.

Ponle de nombre el dominio de tu web y elige
dónde vas a instalarel contenedor.

Haz click en el botón
Crear.

En mi caso tengo un contenedor para este blog y otro más también para este weblog pero solo para los posts(más adelante te explico cómo crearlo también):

4) Ahora te saldrá una ventana con las condiciones de uso y servicio de Google Tag Manager.

Solo debes seleccionar que las admites y hacer clic en el botón
Sí.

5) El próximo paso es
añadir en tu web el códigoque te ha generado para tu contenedor. Y te recuerdo que este será el único código que tengas que añadir. 😃

Por un lado te da un fragmento de código
a)que tienes que añadir
después de la etiqueta en código HTML <head>de las páginas de tu sitio o blog. Y lo mismo con el otro fragmento de código
b)que te da, mas este le tienes que añadir
justo después de la etiqueta <body>.

Aquí puedes seleccionar entre
2 opciones principalespara meter estos fragmentos de código en tu web y más específicamente en WordPress:

Puede ser «complicada» si no tienes mucha idea de código o bien no sabes realmente bien dónde puedes hallar las etiquetas <head> y <body> en la plantilla (
theme) que estés utilizando en tu Wordpress.

Lo «normal» es que estas etiquetas estén en el archivo
/wp-content/themes/<nombre-del-theme-que-uses>/header.php, mas en mi caso que por ejemplo empleo Genesis framework + Metro Pro (te dejopor si te mola) ya te digo que no se hallan en ese fichero…

Y para editar el
header.php(guárdate ya antes una copia del fichero por si las moscas) y añadir los fragmentos de código, puedes hacerlo de 3 formas:

1. Con algún
   cliente FTPcomopara conectar con tu hosting y así editar el archivo desde tu PC.
2. Con el explorador de ficheros del
   panel de control de tu hosting(en general es un cPanel).
3. Con el
   editor de ficheros que trae WordPressya desde el menú
   Apariencia > Editor. Ahí escoges tu plantilla y el fichero header.php para alterarlo.

Sin duda lo más sencillo es utilizar algún plugin de Wordpress que te añade automáticamente los fragmentos de código de Google Tag Manager donde corresponda.

Para eso voy a recomendarte dos plugins según sea tu caso:

1. 
   Si empleas cualquier plantilla que NO sea Genesis:. Solo tienes que meterle el ID del contenedor de Google Tag Mánager (puedes localizarlo en el fragmento de código como verás en la imagen) y escoger dónde quieres que meta el código.

Por defecto lo mete en el
footer, o sea, al final de la etiqueta <body> y Google aconseja que sea justo al comienzo, mas es la única opción si no quieres meterlo manualmente… ☹️

1. 
   Si utilizas una plantilla de Genesis:(el que uso yo). Lo tengo desde que me instalé Genesis y es una maravilla por el hecho de que me deja meter distintos códigos por diferentes partes del weblog (lo que llama como
   hookso ganchos) para personalizarlo a mi gusto y sin tener que caminar tocando de forma directa los ficheros de la plantilla.

Solo tienes que meter el fragmento de código
a)para la etiqueta <head> en el gancho
genesis_doctype, y el fragmento de código
b)para la etiqueta <body> en el gancho
genesis_before. Guarda los cambios,
¡y ya está!😃

Personalmente, si no tuviese Genesis, lo haría
de la forma manual. Pero lo hagas como lo hagas, asegúrate de que aparecen los fragmentos en el código de tus páginas:

Cuando lo tengas, vuelve a la página web de Google Tag Mánager donde lo habías dejado y haz click en el botón
Aceptar.

Lo siguiente que verás es sencillamente
el área de trabajodel contenedor en tu cuenta en Google Tag Manager. Fíjate en el recuadro verde de la derecha que pone
Contenedor no publicado; ese es el próximo paso. 😉

6) Pues eso, que ya solo nos queda «publicar el contenedor», pues todo cuanto hagas o alteres en esta área de trabajo no se aplicará en tu web
hasta que no publiques una versión de los cambios.

Para eso tienes que hacer click arriba a la derecha en el botón
Enviar, y se te abrirá una ventana donde puedes poner el nombre a esa versión que vas a publicar y una descripción (si quieres).

Después haz clic
en el botón
Publicar
(tarda unos segundos nada más) y cuando esté todo publicado en tu página web te mostrará un resumen.

¡Y ya tienes Google Tag Mánager instalado! 😃

🔹 Cómo instalar Google Analytics con Google Tag Manager

Google Analytics acostumbra a ser la primera herramienta que «conectamos» la mayoría de los mortales cuando empezamos a emplear Google Tag Manager por primera vez.

Es la primera etiqueta que se suele añadir al contenedor, así que voy a explicarte
cómo lo he hechoen este blog punto por punto.

1) Desde el área de trabajo de Google Tag Manager, arriba a la izquierda haz clic en
Nueva etiquetao
Añadir nueva etiqueta(es lo mismo).

2) Aparecerá una ventana donde puedes poner
nombre a tu nueva etiqueta. En mi caso me he vuelto ido de creatividad y la he llamado Google Analytics…

Haz clic en el recuadro de
Configuración de la etiqueta.

3) Aquí veras todos los tipos de etiquetas de las diferentes herramientas que puedes conectar con tu contenedor.

Haz clic en

Universal Analytics
, que es la más actual de Analytics.

Para saber si estás utilizando Universal Analytics en tu cuenta de Analytics (cosa que te invito a ), lo mejor es que vayas al menú
Administrar
de Google Analyticsy entres en el apartado
Propiedad > Información de seguimiento > Código de seguimiento.

Aquí verás tu ID de seguimiento, y si comienza por
UAes que ya usas Universal Analytics. Si no, en el apartado de
Propiedadverás una opción para.

posicionamiento seo melilla ) La configuración de esta etiqueta es sencillísima. Solo tienes que elegir

Página vista
como
Tipo de seguimientoy elegir la variable de tu configuración de Google Analytics.

Como aún no está creada, elige
Nueva variable…

5) Se abrirá una ventana para crear
una nueva variabledonde se guardará tu ID de seguimiento de Analytics, y así podrás usar esta variable en cualquier otra etiqueta de GTM

Mete tu ID y en
Dominio de la cookiepuedes dejar el valor
auto.

Si estás interesado en recoger las IPs de tus visitas
de forma anónima(pues según lala IP es un dato personal y requiere que tomes ciertas medidas de seguridad), en esta ventana donde estás configurando la variable haz clic en
Más opciones > Campos para configurary añade el campo
anonymizelpy el valor
true.

Haz click en el botón Guardar.

6) Ahora te pedirá que pongas
un nombre a esta variable. Una vez más sale mi vena creativa y la llamo
Configuración de Google Analytics… 😃

Haz clic en el botón
Guardar.

7) Ya tienes configurado «lo que hará» la etiqueta, que es enviar a Google Analytics
todos los datos de las visitasque recibe tu página web o weblog. Ahora toca configurar el activador, es decir, «cuándo» se enviará esta información.

Haz click en el recuadro de
Activación.

8) Aquí verás que por defecto ya hay un activador creado que es del tipo de
Página vista, esto es, que se activa
cuando se ve o visita una página.

En este género de activadores puedes filtrar para qué páginas específicamente deseas que se active, pero en un caso así se llama
All Pagesporque está configurado para activarse en
todas las páginasque se visiten.

Selecciona el activador
All Pages.

9) Ya tienes configurada la etiqueta para Analytics.

No era tan difícil, ¿verdad? 😉

Haz click en el botón de
Guardar.

10) Recuerda que esta etiqueta (y cualquier otro cambio que hagas en tu área de trabajo) no se aplicará en tu página web
hasta que no publiques una nueva versióndel contenedor.

Peeeero,
antes de publicaruna nueva versión sería interesante ver si la etiqueta marcha, ¿verdad? Pues agárrate a la silla porque se puede hacer merced a la opción de
Vista Previaque tiene Google Tag Mánager.

Desde tu área de trabajo, arriba a la derecha si haces click en el botón de
Vista Previaentrarás a un modo con el que podrás navegar por tu página web
como si hubieras aplicado ya los cambiosen tu contenedor, y así probar que las etiquetas marchan bien ya antes de publicar.

Ahora si entras a tu página web desde otra pestaña (en exactamente el mismo navegador donde estés usando Google Tag Manager) verás que te aparece en la parte inferior un
«panel de depuración»(que solo podrás ver tú).

A la izquierda del panel tienes los acontecimientos de tu web y a la derecha las etiquetas «disparadas» por tus activadores a raíz de esos acontecimientos.

Aquí por ejemplo si escoges el acontecimiento
Page Viewverías
las etiquetas disparadas por ese evento, que en este caso ha sido la etiqueta de Google Analytics que terminas de crear.

Mola ¿eh? 😎

Pues cuando confirmes que todo funciona bien, no tienes más que volver al área de trabajo de Google Tag Mánager y hacer click en
Salir del modo de vista previa.

Ahora sí, ya puedes
publicar una nueva versióncon los cambios del contenedor.

Recuerda que simplemente es hacer click en el botón
Enviarque tienes arriba a la derecha en tu área de trabajo, le pones un nombre y una descripción (si quieres) y después haces clic en el botón Publicar.

¡Y ya tienes Analytics instalado con Google Tag Mánager! 😃

Si ya tenías algún código en tu sitio para registrar las visitas en Analytics, recuerda
quitarlopara que no te cuente el doble de visitas.

➤

🔹 Registrar clics en links salientes de afiliados

Ahora que ya tienes Analytics registrando las visitas de tu página web o bien blog, vamos a aprovechar para saber los clicks que hacen tus visitas
en los enlaces de afiliadosque tengas (algo que en mi weblog es «crucial» por el hecho de que primordialmente vivo de esos ingresos).

Viene excelente para saber por dónde y cara dónde «convierten» esas visitas. 😁

1) Lo primero que hay que hacer es
activar la variable
Click URL
, para saber la URL del link en el que se hará el clic.

Es sencillísimo, en esta imagen verás los
4 mini-pasosque tienes que dar para activarla:

1. Ves al apartado
   Variables.
2. Haz click en el botón
   Configurar.
3. Elige
   Click URLen la ventana de
   Configurar las variables integradas.
4. Ya está activada y la verás en el panel de
   Variables integradas.

2) Ahora hay que crear otra variable con
los tipos de links de afiliadoque puedas tener en tu página web o bien blog. Esta variable la usaremos entonces como filtro a fin de que al registrar los clicks solo tenga presente estos géneros de link.

Haz click en
Variables, y en el apartado
Variables definidas por el usuariohaz click en
Nueva.

Ponle el nombre que quieras, yo le he puesto
Tabla de links de afiliado. 😀

Haz click en el recuadro
Configuración de la variabley elije el tipo
Utilidades >
Tabla RegEx
.

Y en esta pantalla de
Configuración de la variableque verás ahora es donde está la «chicha»:

• 
  Variable de entrada:
  
  Click URL
  (la que has activado en el paso inicial).
• 
  Tabla RegEx: como no hay un «patrón global» que defina todas y cada una de las URLs de afiliado del mundo, tendrás que añadir tantas filas como «patrones» de tipos de links que puedas tener utilizando, y a todas y cada una en el campo
  Salidaponle
  true.
• 
  Establecer valor predeterminado: elegido y con el valor
  false.
• 
  No distinguir entre mayúsculas y minúsculas: escogido.
• 
  Solo coincidencias totales: no elegido.
• 
  Habilitar conjuntos de captura y reemplazar funciones: no seleccionado.

Por si no estás muy familiarizado con el tema de las expresiones regulares, verás que en la imagen he añadido algunas que quizá te puedan servir:

➤ La 1ª fila es la que empleo (salvo en los links de Amazon Afiliados), porque mis enlaces de afiliado son «internos» del tipo
miposicionamientoweb.es/visitar/<lo que sea>que luego te redireccionan al verdadero link saliente de afiliado; esto es así pues uso el pluginque me sirve precisamente para facilitar este tipo de cosas, para ponerles
nofollow(cosa que), reunirlos por categorías, estadísticas de clics, etc.

➤ La 2ª fila es el clásico link acortado de Amazon Afiliados, con lo que cualquier enlace que tenga
amzn.to/lo contará como de afiliado.

➤ La 3ª fila sirve para el link «largo» que te da Amazon Afiliados, y tendrá en cuenta todos los links del tipo
amazon.es/<lo que sea>tag=miposiweb-21. Aquí tendrás que cambiar mi tag «miposiweb-21» por el que uses tú en Amazon Afiliados.

➤ Las filas 4ª y 5ª sirven a fin de que cuente como enlace de referido aquellas URLs que tengan variables del tipo «
ref=» y «
aff=«, que son variables que suelen añadirse al final de los enlaces de afiliado para indicar tu número de afiliado.

En definitiva, esta tabla lo que hace es devolver
truesolo si la variable
Click URLcoincide con alguno de estos patrones (
si es un enlace de afiliado), y si no, devuelve
false. 😉

3) Ahora sí, ves a
Etiquetaso desde el área de trabajo de Google Tag Mánager arriba a la izquierda, haz click en
Nueva etiquetao
Añadir nueva etiqueta(es exactamente lo mismo).

4) Ponle nombre a la nueva etiqueta, que en mi caso es (tachán, tachán…)
Clic enlace saliente – afiliado. 😁

Cuando hagas clic en el recuadro de
Configuración de la etiqueta, escoge la

Universal Analytics
. En este caso elige
Eventocomo
Tipo de seguimiento, pues es un acontecimiento presupuesto web ceuta de que se registre en tu Analytics.

El resto de la configuración:

• 
  Categoría: puedes poner cuanto quieras, algo que describa el evento.
• 
  Acción: haz click en el botón + de la derecha y escoge la variable
  Click URL(la URL del enlace de afiliado en el que se hace clic).
• 
  Etiqueta: haz clic en el botón + de la derecha y elige la variable
  Page Path(la página de tu página web o bien weblog desde la que se hace click).
• 
  Valor: ninguno.
• 
  Hit sin interacción:
  Falso.
• 
  Configuración de Google Analytics: la variable que creaste para(paso cinco).

5) O.K., pues ahora haz clic en el recuadro de
Activacióny escoge el activador

Clic – Solo enlaces
. Y ponle el nombre que desees, que en mi caso es
Clic en link de afiliado(¡chúpate esa originalidad!).

Los ajustes que debes configurar para el activador:

• 
  Esperar etiquetas: elegido (dos mil milisegundos por defecto).
• 
  Comprobar la validación: seleccionado.
• 
  Habilite este activador cuando se cumplan todas estas condiciones: para hacer que se active en todas las páginas de tu sitio, escoge
  Page URLen el primer campo, escoge
  
  coincide con la expresión regular
  en el segundo campo y escribe
  .*en el último campo.
• 
  Este activador se activa en: a fin de que solo se active en los enlaces salientes que deseemos (de afiliado), elige la opción
  Algunos clicks en enlaces.
• 
  Ejecute este activador cuando tenga sitio un Evento y se cumplan todas y cada una estas condiciones: aquí es donde debes seleccionar tu variable con la
  Tabla de links de afiliadoen el primer campo,
  es igualen el segundo campo y
  trueen el último campo. Así solo tendrá en cuenta los links que coincidan con los patrones de la tabla donde has definido tus enlaces de referido.

Y ya tienes configurada toda la etiqueta para registrar clicks en links salientes de afiliado. Créeme, semeja más complicado de lo que es de verdad. 😉

Haz clic en el botón de
Guardar.

6) Bien sabes lo que toca ahora,
publicar una nueva versión con los cambios hechosen el contenedor.

Recuerda que ya antes de publicar los cambios puedes utilizar la
Vista Previapara ver
si efectivamente la etiqueta funcionay registra los clicks en links salientes de afiliado, que no se activa haciendo clic en enlaces internos, etc.

En esta imagen por poner un ejemplo ves que al hacer click en el enlace de afiliado, en la columna de acontecimientos del panel de depuración aparece el acontecimiento
gtm.linkClicky en la derecha señala que
se ha disparadola etiqueta
Clic link saliente – afiliado.

Además, si haces clic sobre el recuadro de esa etiqueta te muestra sus propiedades con
la información del eventoque enviará a Google Analytics: la categoría, la URL del link, la página desde la que se hace el clic, etc.

¡Es bestial! 😊

Pues ale, si todo está bien ya puedes
publicar la nueva versióncon los cambios del contenedor.

Ya sabes, haces clic en el botón
Enviarque tienes arriba a la derecha en tu área de trabajo, le pones un nombre y una descripción y luego haces click en el botón Publicar.

¡Y ya estarás registrando los clicks en links salientes de afiliado! 😃

➤

🔹 Registrar clicks en enlaces salientes NO de afiliados

Otra de las cosas interesantes que puedes registrar también son los clics que se hacen
en cualquiera de tus enlaces salientesy que NO sean de afiliados, que viene excelente para saber por dónde y hacia dónde «se escapan» esas visitas si no es para «convertir». 😁

1) Antes de crear esta etiqueta, necesitas tener hechos los dos primeros pasos del(luego entenderás por qué):

1. 
   Activar la variable
   Click URL
   para saber la URL del enlace en el que se hará el click (paso 1 del apartado precedente).
2. 
   Crear una variable con una tabla RegExcon los modelos de enlaces de afiliado que tienes (paso 2 del apartado anterior).

👀 Ojo, si no tienes enlaces de afiliado, el 2º paso no te hace falta, claro.

2) Desde el menú
Etiquetas, o desde el área de trabajo de Google Tag Mánager arriba a la izquierda, haz click en
Nueva etiquetao
Añadir nueva etiqueta(es exactamente lo mismo).

3) Ponle nombre a la nueva etiqueta, que en mi caso es
Clic link saliente – NO afiliado.

Lo sé… 🤯

Cuando hagas clic en el recuadro de
Configuración de la etiqueta, elige la

Universal Analytics
. En este caso elige
Eventocomo
Tipo de seguimiento, porque es un evento lo que va a lanzar esta etiqueta para que se registre en tu Analytics.

El resto de la configuración:

• 
  Categoría: puedes poner lo que quieras, algo que describa el evento.
• 
  Acción: haz clic en el botón + de la derecha y elige la variable
  Click URL(la URL del enlace en el que se hace click).
• 
  Etiqueta: haz click en el botón + de la derecha y escoge la variable
  Page Path(la página de tu web o weblog desde la que se hace click).
• 
  Valor: ninguno.
• 
  Hit sin interacción:
  Falso.
• 
  Configuración de Google Analytics: la variable que creaste para(paso cinco).

4) Ok, haz clic en el recuadro de
Activacióny escoge el activador

Clic – Solo enlaces
. Ponle también el nombre que te apetezca; yo lo he llamado
Clic en link NO de afiliadopara distinguirlo del activador del apartado precedente.

Los ajustes que tienes que configurar para el activador:

• 
  Esperar etiquetas: seleccionado (2000 milisegundos por defecto).
• 
  Comprobar la validación: elegido.
• 
  Habilite este activador cuando se cumplan todas estas condiciones: para hacer que se active en todas las páginas de tu lugar, escoge
  Page URLen el primer campo, elige
  
  coincide con la expresión regular
  en el segundo campo y escribe
  .*en el último campo.
• 
  Este activador se activa en: para que solo se active en los enlaces salientes y NO de afiliados, escoge la opción
  Algunos clics en enlaces.
• 
  Ejecute este activador cuando tenga sitio un Acontecimiento y se cumplan todas estas condiciones: aquí defines concretamente que sean enlaces salientes, y para eso escoge
  Click URLen el primer campo,
  no contieneen el segundo campo y escribe
  tu dominioen el último campo. Y además,
  si tienes enlaces de afiliados, para que no los tenga en cuenta este activador, añade otra fila de condiciones y escoge la variable
  Tabla de links de afiliadoen el primer campo,
  es igualen el segundo campo y
  falseen el último campo. Así solo tendrá en cuenta los links salientes que además no coincidan con los patrones de la tabla en la que has definido tus enlaces de referido.

Y ya tienes configurada toda la etiqueta para registrar clicks en links salientes. Fácil, ¿no? 😉

Haz click en el botón de
Guardar.

5) Y ahora lo que toca es
publicar una nueva versión con los cambios hechosen el contenedor.

Recuerda que ya antes de publicar los cambios puedes usar la
Vista Previapara ver
si efectivamente la etiqueta funcionay registra los clics en links salientes, que no se activa haciendo click en enlaces internos, que tampoco se activa en links salientes de afiliado, etc.

En esta imagen por servirnos de un ejemplo ves que al hacer click en el link saliente, en la columna de acontecimientos del panel de depuración aparece el evento
gtm.linkClicky en la derecha señala que
se ha disparadola etiqueta
Clic link saliente – NO afiliado.

Además, si haces clic sobre el recuadro de esa etiqueta te enseña sus propiedades con
la información del eventoque enviará a Google Analytics: la categoría, la URL del link, la página desde la que se hace el click, etc.

¡Cómo me mola! 😊

Pues ya está, ahora sí que sí puedes
publicar la nueva versióncon los cambios del contenedor.

Ya sabes, haces clic en el botón
Enviarque tienes arriba a la derecha en tu área de trabajo, le pones un nombre y una descripción y luego haces clic en el botón Publicar.

¡Y ya estarás registrando los clicks en links salientes! 😃

➤

🔹 Ajustar la tasa de rebote

Ya te manejas por Google Tag Mánager tal y como si lo hubieras parido, ¿verdad? 😁

Bueno pues te voy a enseñar las etiquetas que he instalado también para ajustar la tasa de rebote en mi weblog a mi gusto ().

En este caso la idea es que se lance un acontecimiento a Google Analytics cuando el usuario haga
scroll después de diez segundosque lleva visitando esa página del blog, por el hecho de que para mí eso ya no sería un «rebote» como lo comprende Google Analytics.

¡Vamos al lío!

1) Lo primero es añadir una etiqueta nueva (ves a
Etiquetaso desde el área de trabajo haz click en
Nueva etiqueta) y que sea de tipo

HTML personalizado
.

Esta etiqueta se encargará solita de añadir en tu sitio un código de JavaScript (¡sin que lo debas añadir tú de manera directa!) que controlará cuándo hace scroll el usuario después de 10 segundos, para entonces avisar al Google Tag Manager.

Este es el código que debes añadir en el apartado de HTML:

<script>

var listenerScrollGA = function()

window.removeEventListener(‘scroll’, listenerScrollGA); // solo trackea el evento una vez


window.dataLayer.push(‘event’:’Timeout y Scroll‘, ‘eventCategory’:’Ajuste Tasa de Rebote GTM’, ‘eventAction’: ‘Scroll despues 10 sg GTM’);

setTimeout(function()

window.addEventListener(‘scroll’, listenerScrollGA);

, diez);

</script>

La parte en azul es la primera cosa que se ejecuta, que es aguardar diez.000 milisegundos (10 segundos), y cuando pasan esos 10 segundos se queda aguardando a que el usuario haga scroll en algún instante.

Toda la parte en verde se ejecuta cuando el usuario ha hecho scroll. Lo primero que hace es dejar de esperar a que el usuario haga scroll más veces (a fin de que el código solo se ejecute 1 vez).

Y concretamente la
parte en verde con negritaes la que «notifica» al Google Tag Mánager con un acontecimiento de que el usuario hizo scroll después de diez segundos.

Te señalo el nombre del evento en
naranja con negritaporque más adelante te hará falta este mismo nombre.

2) Ahora toca crear el activador que hará que se añada este código HTML en tu página web o blog. Así que dale al recuadro de
Activación, dale al botón
+para añadir un nuevo activador, haz clic en el recuadro de
Configuración del activadory escoge el de tipo

Página vista – La ventana se ha cargado
.

De esta forma el código JavaScript se añadirá en tu sitio cuando se haya cargado la página por completo, y así empezará a contar los diez segundos
desde ese instante y no antes, para que la tasa de rebote sea más «real».

Haz clic en
Guardarel activador (ponle el nombre que desees como
Ventana cargada por completo) y en
Guardarla etiqueta (que yo he llamado
Timeout y Scroll para mejora de rebote).

3) Ahora añade otra
Nueva etiquetade tipo

Universal Analytics
que será con la que «avisaremos» a Analytics de que se ha lanzado el acontecimiento

Timeout y Scroll
(paso 1).

La he llamado
Envía acontecimiento Timeout y Scroll. 😃

Configuración:

• 
  Tipo de seguimiento: Acontecimiento.
• 
  Categoría: puedes poner cuanto quieras, algo que describa el acontecimiento como
  Ajuste Tasa de Rebote GTM.
• 
  Acción: pues también algo descriptivo, como
  Scroll después de 10 sg GTM.
• 
  Etiqueta: no es preciso que pongas nada si no deseas. O bien puedes hacer click en el botón + de la derecha y elegir la variable
  Page Pathpara saber la página desde la que se lanza el acontecimiento.
• 
  Valor: ninguno.
• 
  Hit sin interacción:
  Falso.
• 
  Configuración de Google Analytics: la variable que creaste para(paso 5).

5) Vale, pues ahora haz click en el recuadro de
Activación, dale al botón
+para añadir un nuevo activador, haz click en el recuadro de
Configuración del activadory elige el de tipo

Otros – Acontecimiento personalizado
.

Ponle el nombre que desees, que en mi caso es
Evento adaptado de Timeout y Scroll.

Los ajustes del activador son muy sencillos:

• 
  Nombre de evento: aquí tienes que poner exactamente el mismo nombre que le pusiste al acontecimiento en el código JavaScript del paso 1, es decir,
  
  Timeout y Scroll
  .
• 
  Este activador se activa en: aquí puedes elegir
  Todos los acontecimientos personalizadosya que verdaderamente solo se activará cuando se lance el acontecimiento que le hemos indicado (y que solo se lanza una vez por página vista).

Y ya tienes configurada toda la etiqueta para registrar en Google Analytics los eventos que
tú mismo lanzasen tu lugar en el momento en que un usuario hace scroll después de 10 segundos. ¡¿A que mola?! 😉

Haz clic en
Guardarel activador y después en
Guardarla etiqueta.

6) Y el último paso ya sabes cuál es,
publicar una nueva versión con los cambios hechosen el contenedor.

Recuerda que antes de publicar los cambios puedes emplear la
Vista Previapara ver
si ciertamente la etiqueta funcionay lanza y registra el evento de scroll después del timeout, si no lo registra antes de los primeros 10 segundos, etc.

En esta imagen por poner un ejemplo ves que cuando se carga la ventana por completo (acontecimiento
Window Loaded) se «dispara» la etiqueta que
añade el código HTML/JavaScriptque controla cuándo hace scroll el usuario después de aguardar diez segundos.

Cuando eso ocurre y Google Tag Mánager advierte el evento
Timeout y Scrolllanzado por ese código, entonces «dispara» la otra etiqueta a fin de que
se registre el acontecimiento en Google Analyticsy que esa visita ya no cuente como un «rebote».

Chachi, ¿verdad? 😊

¡Listo! Si has comprobado que todo marcha bien ya puedes
publicar la nueva versióncon los cambios del contenedor.

Ya sabes, haces click en el botón
Enviarque tienes arriba a la derecha en tu área de trabajo, le pones un nombre y una descripción y luego haces clic en el botón Publicar.

¡Y ya estarás ajustando la tasa de rebote de tu web o bien weblog! 😃

➤

⚡ Cómo instalar Google Tag Mánager en WP para AMP

El procedimiento es básicamente exactamente el mismo que con el contenedor web: crear un contenedor para AMP y pegar los fragmentos de código que produce Google Tag Mánager en las etiquetas <head> y <body>. Solo que esta vez se hace
en las páginas AMP.

Pero como también lo he hecho en este weblog, aprovecho para explicártelo y que quede más claro. 😊

1) Desde el área de trabajo de Google Tag Mánager, arriba a la izquierda haz click en la pestaña donde pone
Administrador.

2) En esta página verás dos columnas: a la izquierda tu cuenta y a la derecha los contenedores de tu cuenta.

Pues en la de la derecha haz clic en el botón
+para
añadir un nuevo contenedora tu cuenta.

3) Del mismo modo que cuando hiciste el contenedor web, solo tienes que ponerle un nombre y en un caso así escoger que es
de tipo AMP.

Haz clic en el botón
Crear.

4) Y el próximo paso es
añadir en tu página web el códigoque te ha generado para tu contenedor AMP.

Por un lado te da un fragmento de código
a)que tienes que añadir
al final de la etiqueta HTML <head>de las páginas AMP de tu sitio web o bien weblog. Y lo mismo con el otro fragmento de código
b)que te da, mas este le debes añadir
justo después de la etiqueta <body>.

Aquí también puedes escoger entre
2 opciones principalespara meter estos fragmentos de código en tus páginas AMP y más en concreto en WordPress:

Al ser manualmente, esta opción te vale tengas el plugin que tengas para tener AMP en tu WordPress (si es que empleas alguno). Y lógicamente será «complicada» si no tienes mucha idea de código o no sabes realmente bien dónde puedes localizar las etiquetas <head> y <body> de tus páginas AMP.

Si por servirnos de un ejemplo utilizas el(como en mi caso), lo «normal» es que estas etiquetas estén en el archivo
/wp-content/plugins/amp/templates/single.php.

Pero ojo, porque si se actualiza entonces el complemento perderías los cambios que hagas en ese archivo, así que lo propio es que copies ese fichero y lo pegues dentro de una carpetita llamada /amp/ dentro de la carpetita de tu theme (como lo tengo yo). Esto es, editar el fichero
/wp-content/themes/<nombre-del-tema-que-uses>/amp/single.php.

Y para editar el
single.php(guárdate antes una copia del fichero por si acaso) y añadir los fragmentos de código, como te explicaba con la creación del contenedor web, puedes hacerlo de 3 formas:

1. Con algún
   cliente FTPcomopara conectar con tu alojamiento web y así editar el fichero desde tu computador.
2. Con el explorador de ficheros del
   panel de control de tu hosting(normalmente es un cPanel).
3. Con el
   editor de archivos que trae WordPressya desde el menú
   Apariencia > Editor. Ahí eliges tu plantilla y el fichero single.php para modificarlo.

Esta opción es la más fácil, especialmente si ya empleas. Como podrás ver enexplicando cómo se configura, este plugin es mucho mejor que el «oficial», más completo y con actualizaciones constantes.

Desde el menú de la izquierda del escritorio de tu WordPress haz clic en AMP para acceder a las opciones del complemento. Ahí dirígete a
Settings > Analyticsy de todas y cada una de las opciones que salen,
activa la de Google Tag Manager, que está casi abajo del todo.

Con este GIF animado lo verás más fácil:

Ya ves que una vez activada la opción de Google Tag Manager no tienes más que meter
la ID del contenedor creado(recuerda que la puedes hallar en el fragmento de código o bien en el área de trabajo de GTM), en
Analytics Typeescribe
googleanalyticsy luego te solicita.

¡Y ya está! 😊

Lo importante, lo hagas como lo hagas, es que te pongas bragas… No, en serio, lo importante es que los fragmentos se vean en el código
de tus páginas AMP:

Cuando lo tengas, vuelve a la página web de Google Tag Mánager donde lo habías dejado y haz click en el botón
Aceptar.

Lo siguiente que verás es
el área de trabajodel contenedor AMP en tu cuenta de Google Tag Mánager.

6) Como pasaba con el contenedor web, ahora toca «publicar» este nuevo contenedor para
que se apliquen los cambiosen tus páginas AMP.

Para eso debes hacer click arriba a la derecha en el botón
Enviar, y se te abrirá una ventana donde puedes definir el nombre de esa versión que vas a publicar y una descripción (esto es opcional).

Después haz clic
en el botón
Publicar
(tarda solo unos segundos) y cuando esté todo publicado en tus páginas AMP te mostrará un resumen.

Ya en el área de trabajo verás a la derecha el recuadro verde con la versión de tu contenedor AMP publicada
ahora mismo(que solo tiene el contenedor, sin etiquetas ni nada).

Ahí te enseña cuándo se publicó y quién lo hizo, por si acaso has dado de alta a más usuarios a fin de que puedan hacer cambios en ese contenedor.

¡Y ya tienes Google Tag Mánager instalado para AMP! 😃

🔹 Cómo instalar Analytics con Google Tag Manager para AMP

Vas a ver que el procedimiento es
básicamente el mismoque el que te he explicado para crear una etiqueta de Analytics en un contenedor web. De hecho, como las páginas AMP no dejan JavaScript, verás que las etiquetas y los activadores son mucho más «simples».

1) Desde el área de trabajo
del contenedor AMPde Google Tag Manager, arriba a la izquierda haz clic en
Nueva etiquetao
Añadir nueva etiqueta(es exactamente lo mismo).

2) Pon el nombre de la nueva etiqueta, que en mi caso (sorpresa, sorpresa…) la he llamado
Google Analytics AMP. 😲

Cuando hagas click en el recuadro de
Configuración de la etiquetaverás que la etiqueta que tienes que escoger es la de

Universal Analytics
.

3) La configuración de esta etiqueta para AMP es incluso más sencilla. Solo debes meter el
ID de seguimientode Analytics y escoger

Página vista
como
Tipo de seguimiento.

Si das al
botón de variables, puedes crearte una variable como he hecho (llamada
Id de Seguimiento GA) con el valor de tu ID de seguimiento, y así ya la tienes guardada para otras etiquetas que quieras crearte.

4) O.K., puesto que ahora solo queda que hagas click en el recuadro de
Activacióny escojas el activador
All Pagesdel género de
Página vista, para que «salte»
cuando se vea o visite cualquiera de tus páginas AMP.

Y ya tienes configurada la etiqueta para Google Analytics en AMP. ¡Lo tienes dominao! 😉

Haz clic en el botón de
Guardar.

5) Puesto que lo último que falta es
publicar una nueva versión con los cambios hechosen el contenedor.

En este caso, si activas la opción de
Vista Previa, no verás el «panel de depuración» en tus páginas AMP por el hecho de que la propia estructura de AMP no lo deja, pero sí que funciona el modo de depuración.

Si por ejemplo usasy entras en alguna página AMP con el modo perfecto de
Vista Previaactivado, puedes ver los acontecimientos y las etiquetas del contenedor AMP
que estás editando, y no del que tengas ya publicado.

En verdad esta extensión te vale también para el contenedor web, mas es mucho más precisa
con el contenedor AMPal no tener el «panel de depuración» de Google Tag Mánager.

La verdad es que es muy sencillita de usar, pero por si acaso te dejo aquíque tiene de forma directa Google y donde lo explican mejor, que para eso es suya. 😊

Y ahora sí, ya puedes
publicar la nueva versióncon los cambios del contenedor.

Recuerda, haces clic en el botón
Enviarque tienes arriba a la derecha en tu área de trabajo, le pones un nombre y una descripción (esto es opcional) y después haces click en el botón Publicar.

¡Y ya tienes Analytics instalado en AMP con Google Tag Manager! 😃

Si ya tenías algún código en tus páginas AMP para registrar las visitas en Google Analytics, recuerda
quitarlopara que no te cuente el doble de visitas.

➤

🔹 Registrar clicks en links salientes de afiliados para AMP

Ahora que tienes Analytics registrando las visitas de tu web o weblog en AMP, aprovecharemos para saber si tus visitas hacen click
en los links de afiliadosque tengas (esto en mi weblog es «vital» porque es de donde más genera ingresos).

En este caso con AMP
no hay forma de saber en qué URL se hace clicexactamente (sí, lo sé, es una 💩, mas es lo que tiene AMP…). Aun así, esta etiqueta viene genial para saber las páginas AMP en las que «convierten» las visitas. 😁

1) Desde el área de trabajo de Google Tag Manager arriba a la izquierda, haz click en
Nueva etiquetao
Añadir nueva etiqueta.

2) Ponle nombre a la nueva etiqueta, que en mi caso ya ves que es
Clic enlace saliente – afiliado. Ahora haz clic en el recuadro de
Configuración de la etiqueta yelige la

Universal Analytics
.

Aquí mete la variable de
Id de Seguimiento GAque te expliqué en el(paso 3), y luego escoge

Evento
como
Tipo de seguimiento, porque es un evento lo que va a lanzar esta etiqueta a fin de que se registre en tu Analytics.

El resto de la configuración:

• 
  Categoría: puedes poner lo que quieras, algo que describa el evento
  y que es de AMP(para diferenciarlo del evento que lance el contenedor web).
• 
  Acción: pon lo que quieras, pues para AMP no hay ninguna variable
  Click URLcomo sí que había en el contenedor web, así que no se puede saber dónde se hace click precisamente. 😞
• 
  Etiqueta: haz click en el botón + de la derecha y escoge la variable
  Page Path(por lo menos sí que se puede saber la página AMP desde la que se hace clic).
• 
  Valor: ninguno.
• 
  Hit sin interacción:
  Falso.

3) Ok, ahora haz clic en el recuadro de
Activacióny elige el activador

Clic
. Y ponle el nombre que quieras, que en mi caso es
Clic en link de afiliado(muy muy muy original…).

En este caso las opciones para AMP son mucho más limitadas que por ejemplo las del activador para los. Aquí solo puedes usarpara definir cuáles son
los tipos de enlaces de referido que tienesen tu página web o weblog.

Y en
Este activador se activa en, escoge la opción
Todas las páginas(para que se active en todas y cada una de las páginas AMP).

Por si no estás muy familiarizado con el tema de los selectores CSS, te diré que son patrones (similares a las expresiones regulares) que se emplean
para escoger elementos o bien etiquetas HTML.

Estos selectores en verdad se suelen emplear en los archivos CSS para mudar el estilo a esos elementos que se «seleccionan», pero en un caso así la etiqueta de AMP emplea estos selectores para acotar
en qué elementos HTML aplicar el activador
Clic
.

Este es el selector CSS que empleo yo para que seleccione tres tipos de enlaces de afiliado que empleo en mi weblog (con una coma entre cada selector):

a[href*=’miposicionamientoweb.es/visitar/’], a[href*=’amzn.to/’], a[href*=’tag=miposiweb-21′]

➤ La 1ª parte
a[href*=’miposicionamientoweb.es/visitar/’]le indica que escoja las etiquetas HTML <
a> (etiquetas de enlaces) donde el atributo
href(la URL) contenga
miposicionamientoweb.es/visitar. En mi caso, empleo el pluginque me sirve a fin de que mis enlaces de afiliado tengan el mismo patrón
miposicionamientoweb.es/visitar/<lo que sea>(y luego te redireccionan al auténtico enlace saliente de afiliado), y esto ya ves que facilita mucho las cosas.

➤ La 2ª parte
a[href*=’amzn.to/’]es lo mismo, mas en un caso así seleccionará las etiquetas <
a> donde el atributo
hrefcontenga
amzn.to/. Este es el dominio de URL corta que se suele emplear en Amazon Afiliados (estos no los uso con el complemento de Pretty Enlaces).

➤ La 3ª parte
a[href*=’tag=miposiweb-21′]es lo mismo, pero en este caso seleccionará las etiquetas <
a> donde el atributo
hrefcontenga
tag=miposiweb-21. Este lo empleo para las URLs largas de Amazon Afiliados que suelen llevar el ID o «tag» del afiliado (y estos tampoco los uso con el plugin de Pretty Enlaces). Aquí tendrás que cambiar mi tag «miposiweb-21» por el que emplees tú en Amazon Afiliados.

➤ Si en tu caso empleas otros enlaces de afiliado, busca si sus URLs tienen variables del tipo «
ref=» y «
aff=«, que son variables que acostumbran a añadirse al final de los enlaces de afiliado para indicar tu número de afiliado. Así podrías añadir otro selector más por servirnos de un ejemplo del tipo
a[href*=’ref=’].

Y ya tienes configurada toda la etiqueta para registrar clics en links salientes de afiliado en tus páginas AMP. Parece más complicado de lo que es realmente. 😉

Haz click en el botón de
Guardar.

6) Pues lo que toca ahora es
publicar una nueva versión con los cambios hechosen el contenedor AMP.

Como te dije, no existe un panel depuración con la opción de
Vista Previapara los contenedores AMP, pero con la extensión de Chrome
Tag Assistantpuedes
comprobar que funciona la etiquetay registra los clicks en enlaces salientes de afiliado desde páginas AMP, que no se activa haciendo click en links internos, etc.

¡Te explico cómo lo he hecho ! 😉

En el área de trabajo de Google Tag Mánager
activa la
Vista Previa
.

Ahora abre otra pestaña del navegador, activa el plugin haciendo clic en el icono del
Tag Assistantarriba a la derecha y después en el botón
Enable.

Después entra en una página AMP donde tengas enlaces de referido y haz clic en uno de eso enlaces de afiliado.

Si ahora haces clic en el icono del Tag Assistant para abrirlo, verás un recuadro con tu ID de seguimiento de Google Analytics. Haz click en ese recuadro y te mostrará las etiquetas enviadas del tipo
PageViewy
Events. Y si haces clic encima de
Events, podrás ver
los eventos mandados por tus etiquetas.

En la última imagen verás que arriba a la derecha tienes unas flechas para moverte por los eventos enviados. En mi caso ya ves que me enseña adecuadamente el evento «disparado» de
Link de afiliado en AMP GTMcon la ruta de la página AMP desde la que se ha hecho clic.

Puedes probar por servirnos de un ejemplo a hacer click en otros links que NO sean de afiliado para comprobar
que no se lanzan más eventos. Y cuando termines, ya puedes hacer click en el botón
Disabledel
Tag Assistanty desactivar la
Vista Previaen Google Tag Mánager.

Mola, ¿eh? 😊

Y ya sí, puedes
publicar la nueva versióncon todos y cada uno de los cambios que has hecho en el contenedor AMP.

Ya sabes, haces clic en el botón
Enviarque tienes arriba a la derecha en tu área de trabajo, le pones un nombre y una descripción y luego haces clic en el botón Publicar.

¡Y ya estarás registrando los clics en links salientes de afiliado para AMP! 😃

➤

🔹 Registrar clics en links salientes NO de afiliados para AMP

Otras de las cosas interesantes que puedes registrar también en tus páginas AMP son los clics que se hacen
en cualquiera de tus enlaces salientesy que NO sean de afiliados.

Te recuerdo que en AMP
no hay forma de saber en qué URL se hace clicexactamente (es un fastidio, sí…). Incluso así, esta etiqueta viene excelente para saber las páginas AMP por las que se «escapan» tus visitas. 😁

1) Desde el área de trabajo de Google Tag Mánager arriba a la izquierda, haz click en
Nueva etiquetao
Añadir nueva etiqueta.

2) Ponle nombre a esta nueva etiqueta. Por poner un ejemplo, yo la he llamado
Clic link saliente – NO afiliado. Ahora haz click en el recuadro de
Configuración de la etiqueta yelige la

Universal Analytics
.

Mete la variable de
Id de Seguimiento GA(que la tendrás creada de apartados anteriores), y después elige

Evento
como
Tipo de seguimiento, pues aquí también es un acontecimiento lo que va a lanzar esta etiqueta a fin de que se registre en tu Google Analytics.

El resto de la configuración:

• 
  Categoría: pon lo que quieras, algo que describa bien el evento
  y que es de AMP(para no confundirlo luego con los acontecimientos que lance el contenedor web).
• 
  Acción: pon cuanto quieras, porque para AMP ya sabes que no existe la variable
  Click URLy no se puede saber la URL donde se hace click precisamente. 😢
• 
  Etiqueta: haz click en el botón + de la derecha y escoge la variable
  Page Path(para saber al menos la página AMP desde la que se hace clic).
• 
  Valor: ninguno.
• 
  Hit sin interacción:
  Falso.

3) Vale, ahora haz clic en el recuadro de
Activacióny escoge el activador

Clic
. Y llámalo como quieras, que en mi caso le he puesto
Clic en enlace NO de afiliado.

Como te decía, las opciones de los activadores para AMP son mucho más limitadas que por poner un ejemplo las que puedes ver para los. Aquí solo puedes utilizar selectores de CSS para delimitar cuáles son
los links salientes NO de afiliado que tienesen tu web o bien blog.

Y en
Este activador se activa en, escoge la opción
Todas las páginas(a fin de que se active en todas y cada una de las páginas AMP).

Como te explicaba en el, esta clase de etiquetas de AMP emplea selectores CSS para acotar
en qué elementos HTML se aplica el activador
Clic
.

Este es el selector CSS que uso yo para que elija todos y cada uno de los links menos los que le indico como enlaces internos y los de Amazon Afiliados (en este caso es un único selector que concadena tres selectores):

a:not([href*=’miposicionamientoweb.es’]):not([href*=’amzn.to/’]):not([href*=’tag=miposiweb-21′])

➤ La 1ª parte
a:not([href*=’miposicionamientoweb.es’])le señala que seleccione las etiquetas en código HTML <
a> (etiquetas de enlaces) que no (:not) contenga
miposicionamientoweb.esen su atributo
href(la URL) por el hecho de que esos serán enlaces salientes. En mi caso, como uso el pluginque me sirve a fin de que mis enlaces de referido tengan exactamente el mismo patrón
miposicionamientoweb.es/visitar/<lo que sea>, este selector ya los excluiría.

➤ La 2ª parte
:not([href*=’amzn.to/’])date cuenta que está pegada a la 1ª, con lo que sería como un subconjunto suyo. Esto es, que le estarías diciendo «de los links salientes de la 1ª parte, escoge solo los que cumplan también esta 2ª parte». Y aquí seleccionará las etiquetas <
a> que no contengan
amzn.to/en su atributo
href(la URL), que son enlaces cortos de Amazon Afiliados que no uso con el complemento de Pretty Links.

➤ La 3ª parte
:not([href*=’tag=miposiweb-21′])está pegada a la 2ª, así que sería otro subconjunto más de links que tendría que excluir. Y aquí seleccionará las etiquetas <
a> que no contengan
tag=miposiweb-21en su atributo
href(la URL), que es la variable que define al filiado y que se usa en los links largos de Amazon Afiliados (y estos tampoco los empleo con el plugin de Pretty Enlaces). Aquí tendrás que cambiar mi tag «miposiweb-21» por el que utilices tú en Amazon Afiliados.

➤ Si en tu caso empleas otros enlaces de afiliado, busca si sus URLs tienen variables del tipo «
ref=» y «
aff=«, que son variables que suelen añadirse al final de los enlaces de afiliado para indicar tu número de afiliado. Así podrías añadir unir otro selector más por servirnos de un ejemplo del tipo
:not[href*=’ref=’].

Y ya tienes configurada esta etiqueta para registrar clicks en links salientes NO de afiliado en tus páginas AMP. Esto lo tienes chupao ya. 😉

Haz clic en el botón de
Guardar.

6) El siguiente paso es
publicar una nueva versión con los cambios hechosen el contenedor AMP.

Ya sabes que para «depurar» y probar tus etiquetas para AMP lo mejor es usar la extensión de Chrome
Tag Assistant, con la que puedes ver si ciertamente
funciona la etiquetay registra los clicks en enlaces salientes NO de afiliado desde páginas AMP, que no se activa haciendo click en links salientes de afiliado, etc.

Es lo mismo que te explicaba en el paso 6 del.

Activas la
Vista Previa
, habilitas el
Tag Assistanten una pestaña del navegador, entras a una de tus páginas AMP donde tengas links salientes NO de afiliado, haces click en uno de ellos y compruebas si ciertamente se «dispara» el evento
Link NO de afiliado en AMP GTM.

Y prueba también que haciendo clic en enlaces de afiliado
no se lanzan más eventos.

Sencillo, ¿no? 😊

Y ya al fin puedes
publicar la nueva versióncon todos y cada uno de los cambios que has hecho en el contenedor AMP.

Ya sabes, haces click en el botón
Enviarque tienes arriba a la derecha en tu área de trabajo, le pones un nombre y una descripción y después haces click en el botón Publicar.

¡Y ya estarás registrando los clics en links salientes NO de afiliado para AMP! 😃

➤

🔹 Ajustar la tasa de rebote para AMP

Bueno, puesto que como ya tienes nivel Jedi en esto de crear etiquetas para AMP, voy a enseñarte las etiquetas que he instalado también en mis páginas AMP para ajustar la tasa de rebote a mi gusto ().

A diferencia del contenedor web, el contenedor AMP está mucho más limitado y no deja por ejemplo crear etiquetas de
HTML personalizadoni «anidar» etiquetas. Así que en este caso
NOpuedo hacer que se lance un acontecimiento a Analytics cuando el usuario haga scroll después de 10 segundos. 💩

Lo que sí puedo hacer es que se envíe
un eventoa Analytics cuando el usuario haga
un porcentaje de scrollrespecto a la altura total de la página, y que se envíe
otro eventodistinto para
cuando pasen veinte segundos. Así, el primer evento que se lance de estos dos será el que «cancele» el rebote de la visita.

¡Al lío! 😃

1) Lo primero es añadir una etiqueta nueva (ves a
Etiquetaso desde el área de trabajo haz click en
Nueva etiqueta). Yo la he llamado
Envío de acontecimiento Timeout mejora de rebote.

Ahora haz clic en el recuadro de
Configuración de la etiqueta yelige la

Universal Analytics
.

Mete la variable de
Id de Seguimiento GA(que ya la tendrás creada de apartados precedentes), y luego escoge

Evento
como
Tipo de seguimiento, pues aquí también es un evento lo que va a lanzar esta etiqueta para que se registre en tu Google Analytics.

El resto de la configuración:

• 
  Categoría: escribe algo que sea gráfico
  y que es de AMP(para no confundirlo luego con los eventos que lance el contenedor web).
• 
  Acción: pon lo que quieras, algo que por ejemplo defina más en concreto el evento de timeout de 10 segundos para AMP.
• 
  Etiqueta: como el acontecimiento «simplemente» es para ajustar el rebote puedes dejarlo vacío. O bien puedes hacer click en el botón + de la derecha y escoger la variable
  Page Pathpara saber la página AMP desde la que se lanza el evento.
• 
  Valor: ninguno.
• 
  Hit sin interacción:
  Falso.

2) Excelente, ahora haz clic en el recuadro de
Activación, dale al botón
+para añadir un nuevo activador, haz click en el recuadro de
Configuración del activadory escoge el de tipo

Temporizador
.

Ponle el nombre que quieras, que en mi caso es
Temporizador 10 segundos.

Los ajustes del activador son sencillísimos:

• 
  Intervalo: aquí se ponen los
  10 segundosque tienen que pasar ya antes de lanzar el evento.
• 
  Límite: aquí se pone el límite de tiempo a lo largo del que «funcionará» el activador. Si por poner un ejemplo pusiese 30 segundos, el activador se dispararía cada diez segundos (los que he puesto en el campo
  Intervalo), es decir, 3 veces (treinta sg / diez sg = tres veces). En mi caso, como solo quiero
  que se lance 1 vez, pongo el mismo valor que el
  Intervalo(diez sg / 10 sg = 1 vez).
• 
  Activar de manera inmediata cuando se haya generado: NO seleccionado, para que solo se «dispare» con la página cargada después de los segundos indicados en
  Intervalo.
• 
  Este activador se activa en: todas y cada una de las páginas.

Y así ya tienes configurada la etiqueta para registrar en Analytics un acontecimiento cuando un usuario ha pasado
10 segundos en tu página AMP.

Mola, ¡¿eh?! 😉

Haz click en
Guardarel activador y después en
Guardarla etiqueta.

3) Ahora toca añadir una nueva etiqueta a parte (haz clic en
Nueva etiqueta) para el evento de scroll. Yo la he llamado
Envío de acontecimiento Scroll mejora rebote.

Haz clic en el recuadro de
Configuración de la etiqueta yelige la

Universal Analytics
.

Aquí también tienes que meter la variable de
Id de Seguimiento GA, y luego selecciona

Evento
como
Tipo de seguimiento, que es lo que se enviará a Google Analytics cuando se active la etiqueta.

El resto de la configuración:

• 
  Categoría: escribe algo que sea gráfico
  y que es de AMP(para no confundirlo entonces con los acontecimientos que lance el contenedor web).
• 
  Acción: pon lo que quieras, algo que por servirnos de un ejemplo defina más en concreto el acontecimiento del veinte por ciento de scroll para AMP.
• 
  Etiqueta: como el acontecimiento «simplemente» es para ajustar el rebote puedes dejarlo vacío. O puedes hacer click en el botón + de la derecha y escoger la variable
  Page Pathpara saber la página AMP desde la que se lanza el acontecimiento.
• 
  Valor: ninguno.
• 
  Hit sin interacción:
  Falso.

4) Perfecto, ahora haz click en el recuadro de
Activación, dale al botón
+para añadir un nuevo activador, haz click en el recuadro de
Configuración del activadory escoge el de tipo

Desplazamiento
(que es el del scroll).

Ponle el nombre que quieras, que en mi caso es
Scroll del veinte por ciento.

Los ajustes del activador son aun más sencillos que los del temporizador:

• 
  Porcentajes verticales: aquí pones 20, que será el
  porcentaje de scroll en verticalque habrá que hacer para que se active y se lance el evento.
• 
  Porcentajes horizontales: aquí no pongas nada por el hecho de que en un caso así no te resulta interesante el scroll horizontal.
• 
  Este activador se activa en: todas y cada una de las páginas.

Y así ya tienes configurada también la etiqueta para registrar en Analytics un acontecimiento en el momento en que un usuario haga
scroll vertical cuando menos el 20 por cien del totalde la página en AMP. 😃

Haz click en
Guardarel activador y después en
Guardarla etiqueta.

5) Y el último paso puesto que es como siempre y en toda circunstancia
publicar una nueva versión con los cambios hechosen el contenedor AMP.

Ya sabes, para «depurar» y probar las etiquetas para AMP lo más interesante es hacerlo con
Tag Assistant, y así podrás ver si
funciona la etiquetay registra los acontecimientos de timeout y veinte por ciento de scroll por separado, si los registra en el orden adecuado, etc.

Activas la
Vista Previa
, habilitas el
Tag Assistanten una pestaña del navegador, entras a una de tus páginas AMP, haz mucho scroll cara abajo, espera también por lo menos 10 segundos y compruebas si ciertamente se «disparan» los dos acontecimientos.

Y prueba también primero a esperar los diez segundos y luego a hacer scroll, a ver si registra bien
el orden en que se lanzanlos acontecimientos.

Muy fácil. 😊

¡Ahora sí que sí! Ya puedes
publicar la nueva versióncon todos los cambios que has hecho en el contenedor AMP.

Ya sabes, haces clic en el botón
Enviarque tienes arriba a la derecha en tu área de trabajo, le pones un nombre y una descripción y después haces clic en el botón Publicar.

¡Y ya estarás ajustando la tasa de rebote de tus páginas AMP! 😃

➤

🏷️ Revisar las etiquetas en Google Analytics en tiempo real

Como Analytics no te muestra en sus gráficas los datos que registre el día de hoy tu lugar hasta el momento en que no pasen 24 horas, la mejor forma que tienes para comprobar «en vivo» si funcionan adecuadamente
las etiquetas que terminas de publicares utilizando la vista de
En Tiempo Realde Google Analytics.

Aquí lo que suelo hacer es, primero entro en
En Tiempo Real > Ubicacionesy selecciono
Spain > Guadalajara, porque no suele haber visitas en tiempo real desde Guadalajara salvo las mías. 😃

Y con este filtro, ya entro en

En Tiempo Real > Eventos
donde voy viendo que ciertamente se registran los acontecimientos lanzados por las etiquetas según hago clics en links, etc.

Así puedes revisar
al momentoque se han publicado bien los cambios en tu contenedor de Google Tag Manager. 🤗

🏷️ Otras etiquetas interesantes para Google Tag Manager

Hay muchos tutoriales sobre Google Tag Manager normalmente, pero he querido escoger estos que te dejo aquí por el hecho de que van
un paso más alládel «tutorial básico», y ahora que ya lo dominas seguro que te semejan también bien interesantes. 😉

¡Espero que te haya gustado! Y sobre todo,
que te haya sido útil.

Ni que decir debe si conoces alguna otra etiqueta interesante para Google Tag Manager…

¡Cuéntamela! 😃