Google Tag Manager, Analytics y Facebook Ads en 1 hora

@LuciaMarinGTM
Gorka Goikoetxea
@SeoBilbao
Google Tag Manager
&
Google Analytics

@LuciaMarinGTM Gorka Goikoetxea@SeoBilbao
Lucía Marín
Analítica web y Tag Management
cursogoogletagmanager.com
10 años dentro del mundo web:
2 años en humor,
3 años en telefonía,
3 años en agencia ,
y ahora por libre
Escribo sobre analítica web en:
luciamarin.es

Gorka Goikoetxea
SEO, Google Ads y Analítica
Posiciono a empresas en Internet para vender más.
Formo a empresas y profesionales en marketing.
Impulso Evento SEO Bilbao
Escribo sobre marketing y empleo en:
enganchadoainternet.com

Google Analytics
Tu tracking en 1h15min

Vemos 3 seguimientos en Analytics:
● PÁGINAS VISTAS
● EVENTOS
● ECOMMERCE

Cómo llegar al código en Google Analytics… o más bien al ID que necesitamos.
De aquí solo necesitamos conocer el
identificador, en este ejemplo:
UA-88100605-1este es el
identificador o UA- de Analytics

@LuciaMarinGTM
Gorka Goikoetxea
@SeoBilbao
Igual que copiar y pegar el código
Seguimiento
estándar

@LuciaMarinGTM
Gorka Goikoetxea
@SeoBilbao

Lo único que mide Analytics por sí
solo son páginas vistas (URLs)
https://luciamarin.es/como-configurar-google-analytics-con-tag-manager
Dejamos
cookieDomain:
auto para que se
midan bien los
posibles
subdominios

@LuciaMarinGTM
Gorka Goikoetxea
@SeoBilbao
Potencia tus estadísticas
Eventos
Google Analytics

Salvo que midamos eventos con Tag Mananger o código, esta sección de Google Analytics
quedará vacía: COMPORTAMIENTO // EVENTOS

Hacemos así si queremos a los 45 segundos una
sesión ya no se considere un rebote
Marcamos que se
active a los 45000
milisegundos, 1
sola vez (límite).
Que funcione solo
si se accede desde
un dominio
externo al nuestro
(así evitamos que
el timer funcione
innecesariamente)
Personalizar el rebote

Personalizar el rebote
Recordemos dejar marcado:
HIT SIN INTERACCIÓN = FALSO
para que realmente el evento anule el rebote.

Naming de eventos
Idea de @esanchezrojo

Descarga PDF o DOCX
Para definir bien el activador y la etiqueta,
necesitamos habilitar variables integradas de
Click y crear la variable Click Path

Descarga PDF o DOCX
Cuanto más preciso el activador mucho mejor
Podemos usar expresión regular para distintas extensiones
Gracias a las
variables, con una
única etiqueta en
GTM, medimos
todos los eventos del
mismo tipo

Scroll / Profundidad de Desplazamiento
Debemos:
- marcar los puntos de corte del scroll
- elegir si medir solo vertical o también horizontal
GTM por rendimiento o WPO hace este activador
menos prioritario a la hora de cargarlo (gtm.load se
puede dejar así).

Scroll / Profundidad de
Desplazamiento
Debemos habilitar la variable {{Scroll Depth
Threshold}} que nos devuelve el número de scroll.
Este evento es bastante conveniente definirlo sin
interacción.

Vídeos de Youtube
Debemos habilitar variables de vídeo y marcar en el
activador qué acciones de vídeo medir.
Indica la acción: start,
progress, etc.
Probar sin ello y
si no, marcar

Vídeos de Youtube
Lo más complejo es cómo estructurar la info del
evento porque tenemos muchos datos.
En este ejemplo subimos Vídeo Youtube a
categoría de evento, ponemos el título en acción, y
en label veremos este tipo de combinación:
- “start” 0%
- “progress” 10% / 25% / 50% / 75% / 100%
- si hubiéramos puesto “pause” se dispararía el
número de combinaciones posibles
https://luciamarin.es/videos-youtube-google-tag-manager

@LuciaMarinGTM
Gorka Goikoetxea
@SeoBilbao
El rey del tracking
Ecommerce

Salvo que midamos comercio electrónico con Tag Mananger o código, esta sección de Google
Analytics quedará vacía: CONVERSIONES // COMERCIO ELECTRÓNICO

Pasos para medir comercio electrónico mejorado:
1. Activar en Google Analytics y excluir dominios de las pasarelas.
2. Redirigir pasarelas automáticamente a la web en confirmación y KO.
3. Envío de dataLayers con datos Ecommerce.
4. Activar en Google Tag Manager el Ecommerce (variable o etiqueta).
Comercio Electrónico Mejorado
/ Enhanced Ecommerce

Conﬁguración Analytics de Comercio
Electrónico Mejorado / Enhanced Ecommerce
https://luciamarin.es/lista-de-exclusion-de-referencia-en-google-analytics/
https://luciamarin.es/como-medir-pasarela-paypal-google-analytics/

DATA LAYERS de Comercio Electrónico
Mejorado / Enhanced Ecommerce
https://developers.google.com/tag-m
anager/enhanced-ecommerce
Según aquello lo que deseemos medir necesitaremos más dataLayers o menos.

IMPORTANTE PARA ESTE EJEMPLO:
Todas las dataLayers con evento

Ej. Data Layer
Product Impression
Fundamental añadir la fila de evento
en todas para que la implementación
funcione
Todas las dataLayers posibles:
https://developers.google.com/tag-man
ager/enhanced-ecommerce?hl=es#pro
duct-impressions
https://developers.google.com/tag-man
ager/enhanced-ecommerce
<script>
dataLayer.push({
'event': 'productImpression',
'ecommerce': {
'impressions': [
{
'name': 'Triblend Android T-Shirt',
'id': '12345',
'price': '15.25',
'category': 'Apparel',
'list': 'Category',
'position': 1
},
{
'name': 'Donut Friday Scented T-Shirt',
'id': '67890',
'price': '33.75',
'category': 'Apparel',
'list': 'Category',
'position': 2
}]
}
});
</script>

ACTIVADOR Comercio Electrónico Mejorado
/ Enhanced Ecommerce
Podemos con un único activador, seguir todas las
acciones de Ecommerce que enviamos desde el
código de capa de datos o dataLayer.
En este ejemplo solo mediríamos:
- purchase
- productView
- productImpression
- checkout

TAG Comercio Electrónico
Mejorado / Enhanced Ecommerce
Ponemos preferente Evento SIN interacción porque si enviamos
todo como evento (incluidas acciones de vistas de página)
podemos provocar rebote nulo.
Al mandar dataLayers con evento, con una única etiqueta medimos
todo y la implementación queda sencilla y limpia.
Ponemos anulación de configuración en la etiqueta, y activamos el
comercio electrónico en más opciones, así como usar dataLayer.

@LuciaMarinGTM
Gorka Goikoetxea
@SeoBilbao
Google Tag Manager
&
Otras herramientas

Facebook -
Instagram Ads
Tu tracking en 30 minutos
Ads

Cómo llegar al configurador de píxeles y acciones de conversión personalizadas

Ahí podemos ver las estadísticas de los píxeles y crear nuevos:
Píxel Pageview
Píxel Evento

Vemos 3 tipos de seguimiento:
● PÁGINAS VISTAS
● EVENTOS (ESTÁNDAR Y PERSONALIZADOS)
● ECOMMERCE

Código Pageview Facebook:
Etiqueta HTML personalizada

<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', '111111111111111');
fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=111111111111111&ev=PageView&noscript=1"
/></noscript>

Los elementos en
amarillo los
reemplazamos por
{{Variables}} de GTM.
Ej. {{Facebook ID}}

Lo activamos cada vez que se carga una
página (Activador ALL PAGES)
Como idea, también podemos hacerlo, tras
cargar pero a los 5 segundos, si es que
queremos cualificar más al usuario y evitar
que todos los píxeles carguen en Pageview
por WPO (Activador TIMER 5 segundos)
Código Pageview Facebook:
Etiqueta HTML personalizada
+Timer 5 segundos

@LuciaMarinGTM
Gorka Goikoetxea
@SeoBilbao
Potencia tus estadísticas
Eventos
Facebook

Eventos en Facebook
Podemos generar:
- Eventos ESTÁNDAR
- Eventos PERSONALIZADOS
Píxel Evento

Código Evento Facebook
Podemos generar:
- Eventos ESTÁNDAR
- Eventos PERSONALIZADOS
Y se pueden completar con Objects de parámetros, también:
- ESTÁNDAR
- o PERSONALIZADOS
https://developers.facebook.com/docs/facebook-pixel/implementation/conversion-tracking#custom-events

Eventos estándar de
Facebook
En función del sector que elijamos en
el desplegable Facebook nos ofrece
unos eventos u otros
https://developers.facebook.com/docs/facebo
ok-pixel/implementation/conversion-tracking#
standard-events

Eventos estándar de Facebook - ECOMMERCE
https://developers.facebook.com/docs/facebook-pixel/implementation/conversion-tracking#standard-events

Código Evento Búsqueda:
Etiqueta HTML Personalizada
<script>
fbq('track', 'Search', {
search_string: '{{Page Query q}}',
});
</script>
Necesitamos variable {{Page Query q}}
Tipo de Variable: URL
Componenente: Query / Consulta
Clave de consulta: q, s... (parámetro de búsqueda en la URL)

Código Evento Búsqueda:
Dónde activarlo
Comprobamos que el
parámetro de búsqueda
no esté vacío
o DOM Ready

Código Evento Ver Contenido (simple)
<script>
fbq('track', 'ViewContent');
</script>

Conﬁguración ViewContent (simple)
Podemos usar menos variables predefinidas o creadas a medida.
El activador depende de cómo diferenciemos en la web que estamos en un
contenido relevante (URLs, dataLayer, etc).
<script>
fbq('track', 'ViewContent', {
content_name: '{{Page Title}}'
});
</script>

Variables Ecommerce GA (avanzado)
Podemos aprovechar dataLayer de Enhaced Ecommerce si existe en la página
https://developers.google.com/tag-manager/enhanced-ecommerce?hl=es

Conﬁguración ViewContent (ecommerce)
<script>
fbq('track', 'ViewContent', {
value: {{Datalayer product.price}},
currency: 'EUR',
content_ids: '{{Datalayer product.id}}',
content_type: 'product',
content_name: '{{Datalayer product.name}}',
content_category: '{{Datalayer product.category}}'
});
</script>
Podemos añadir además
de content_name,
content_category y
hasta parámetros de
anuncios dinámicos
Activamos solo en páginas de detalle

Código Evento Añadir al Carrito
<script>
fbq('track', 'AddToCart');
</script>

Conﬁguración AddToCart (simple)
<script>
fbq('track', 'AddToCart');
</script>
Activar en click en todos los
botones de añadir al carrito
(catálogo y detalle)
<script>
fbq('track', 'AddToCart',
{content_name: '{{Product Name}}'});
</script>
Necesitamos variable
para saber el producto,
plan B: {{Page Title}}

Conﬁguración
AddToCart
(dynamic ads)
<script>
fbq('track', 'AddToCart', {
value: 1,
currency: 'EUR',
contents: [
{
id: 'SKU',
quantity: 1
}
],
content_ids: 'SKU',
});
</script>
contents
y
contents_ids
son dos
alternativas
distintas para
lograr lo
mismo

Conﬁguración AddToCart (avanzado)
<script>
fbq('track', 'AddToCart', {
value: {{Datalayer product.price}},
currency: 'EUR',
content_ids: '{{Datalayer product.id}}',
});
</script>
Podemos añadir también
content_name y
content_category de
dataLayer ecommerce, si
medimos desde detalles
Activamos en evento click de añadir al carrito (desde detalle)

Conﬁguración AddToWishList (simple)
<script>
fbq('track', 'AddToWishlist');
</script>
Activar en click en todos los
botones de añadir al carrito
(catálogo y detalle)
<script>
fbq('track', 'AddToWishlist',
{content_name: '{{Product Name}}'});
</script>
Necesitamos variable
para saber el producto,
plan B: {{Page Title}},
solo desde detalles

Eventos de Registro, Contacto y Lead

Evento Compra Completada: Purchase

Evento Purchase: Variables Data Layer GA

Código Evento Compra
Completada (matriz de
productos basada en
variable dataLayer)
Esta variable extraería toda la parte de
información de productos comprados de
una dataLayer purchase de Enhanced
Ecommerce de Google Analytics

También se pueden medir eventos a medida...
https://developers.facebook.com/docs/facebook-pixel/implementation/conversion-tracki
ng#custom-events

Twitter Ads
Tu tracking en 15 minutos

2 tipos de seguimiento en Twitter Ads:
● PÁGINAS VISTAS
● EVENTOS (ESTÁNDAR Y PERSONALIZADOS)

Cómo llegar al configurador de píxeles dentro de Twitter Ads...
De aquí solo necesitamos conocer el
identificador, en este ejemplo:
o1xye este es el identificador
para medir pageViews en el ej.

@LuciaMarinGTM
Gorka Goikoetxea
@SeoBilbao
¿Un poco complejo de más?
Píxeles en Twitter

Configuraciones para crear los píxeles...
https://business.twitter.com/es/help/campaign-measurement-and-analytics/conversion-tracking-for-websites.html
Twitter Ads solo ofrece 4
tipos más Personalizado, en
Google Tag Manager
aparecen más ideas

Configuraciones para crear los píxeles...
Para todas las
acciones que solo
dependen de URL
Acciones que ocurren
en click u otra acción
que no cambia la URL
Marcamos si depende
de una página aquí
(por ej. si hay un
registro y tiene thank
you page)

Configuración PAGEVIEW en todas las páginas o en
timer 5 segundos: o1xye, pageview
¿Lagunas en la documentación? “Este es el método
recomendado para identificar eventos de conversión
específicos en función de una URL.”

Código para PAGEVIEW en todas las páginas o en
timer 5 segundos: o1xye, pageview

<script>
!function(e,t,n,s,u,a){e.twq||(s=e.twq=function(){s.exe?s.exe
.apply(s,arguments):s.queue.push(arguments);
},s.version='1.1',s.queue=[],u=t.createElement(n),u.async=!0,
u.src='//static.ads-twitter.com/uwt.js',
a=t.getElementsByTagName(n)[0],a.parentNode.insertBefore(u,a)
)}(window,document,'script');
// Insert Twitter Pixel ID and Standard Event data below
twq('init','o1xye');
twq('track','PageView');
</script>

Si nuestras
conversiones/eventos son en
URL podemos aprovechar el
tipo de seguimiento Universal
Website y marcar URL, y
hacer tag separada en GTM
con su configuración:
o1xye, pageview,
ajustes
concretos
Luego en activación OJO,
ponemos excepción a la
Universal de todas las páginas
para evitar duplicidad de
pageviews.

@LuciaMarinGTM
Gorka Goikoetxea
@SeoBilbao
Cada uno un identificador diferente
Eventos únicos

Evento de Ver Contenido/View Content: o1xyi No se ha econtrado de cómo
implementar esto con Tag Manager:
hacer a Prueba y Error!!

Evento de Ver Contenido/View Content: o1xyi

<script src="//platform.twitter.com/oct.js"
type="text/javascript"></script>
<script
type="text/javascript">twttr.conversion.trackPid('
o1xyi', { tw_sale_amount: 0, tw_order_quantity: 0
});</script>
<noscript>
<img height="1" width="1" style="display:none;"
alt=""
src="https://analytics.twitter.com/i/adsct?txn_id=
o1xyi&p_id=Twitter&tw_sale_amount=0&tw_order_quant
ity=0" />
<img height="1" width="1" style="display:none;"
alt=""
src="//t.co/i/adsct?txn_id=o1xyi&p_id=Twitter&tw_s
ale_amount=0&tw_order_quantity=0" />
</noscript>

Si no funciona esto,
probar a personalizar
el código de twitter

Evento de Compra/Purchase: o1xyj

Dejemos de lado los códigos que da la interfaz y fijémonos solo en los identificadores y en la propia
etiqueta de Tag Manager… Además en la documentación se da una pista sobre el código de
conversión avanzado para Purchase (basado en el tag Universal pero con parámetros , como en la
diapo previa…)

Evento de Compra/Purchase: o1xyj
Damos por hecho como en el caso de
antes que tenemos la dataLayer de
Enhanced Ecommerce en la página.
Para saber el número de ítems habría que
generar una variable.

Llévate tu contenedor recién hecho y calentito :)
[ DESCARGA AQUÍ ]

Google Tag Manager, Analytics y Facebook Ads en 1 hora

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (20)

Similaire à Google Tag Manager, Analytics y Facebook Ads en 1 hora

Similaire à Google Tag Manager, Analytics y Facebook Ads en 1 hora (20)

Plus de Lucía Marín

Plus de Lucía Marín (8)

Google Tag Manager, Analytics y Facebook Ads en 1 hora