Wo WooCommerce Intermedio

DataFirefly Google Tag Manager Pro — Guía completa

Instalar, configurar y explotar el seguimiento GTM premium para WooCommerce: dataLayer GA4 ecommerce, generador de contenedor Tag Pilot, conexiones multiplataforma, server-side Meta CAPI y GA4 Measurement Protocol, Consent Mode v2 y modo píxel directo.

Actualizado Versión del módulo 1.1.0

Presentación y requisitos

DataFirefly Google Tag Manager Pro envía un dataLayer ecommerce de GA4 completo para tu tienda WooCommerce y te permite generar con un clic un contenedor de Google Tag Manager listo para importar, ya conectado a ese dataLayer. El plugin gestiona también el seguimiento server-side (Meta Conversions API, GA4 Measurement Protocol) con deduplicación automática, el Consent Mode v2 y un modo de inyección directa de los píxeles para las tiendas que no usan GTM.

  • WordPress 5.8 y superior, probado hasta 7.0.
  • WooCommerce 7.0 y superior, probado hasta 9.6, compatible con HPOS y Cart/Checkout Blocks.
  • PHP 7.4 y superior.
  • Multilingüe (FR/EN/ES/DE/IT), compatible con Polylang y WPML.
  • No se emite ningún seguimiento en el admin, los feeds ni el personalizador.

El plugin separa dos funciones: produce los datos (el dataLayer de GA4) y te ayuda a distribuirlos (contenedor GTM generado, píxeles directos, eventos server-side). Eliges el modo de distribución que prefieras.

Instalación

  1. Descarga el archivo datafirefly-gtm-pro-1.1.0.zip desde tu cuenta de cliente.
  2. En el admin de WordPress, ve a Plugins > Añadir nuevo > Subir plugin y suelta el archivo.
  3. Haz clic en Activar.
  4. Abre Tag Manager Pro en el menú de administración para acceder a los ajustes.

Al activarse, el plugin registra sus ajustes por defecto. Después puedes rellenar tu contenedor, tus conexiones y activar el server-side pestaña por pestaña.

Pestaña General — contenedor y dataLayer

Esta pestaña controla la inyección del contenedor y la forma del dataLayer:

  • ID del contenedor: tu ID de GTM con el formato GTM-XXXXXXX. Mientras esté vacío, no se inyecta nada del lado de GTM (el dataLayer y el modo directo siguen disponibles).
  • Nombre del dataLayer: dataLayer por defecto. Cámbialo solo si tu instalación lo requiere.
  • Ubicación: head + body (noscript), solo head o solo body.
  • Prioridad de salida: estándar o alta (el contenedor se escribe pronto en el head).

El seguimiento nunca se emite para administradores y personal según los roles excluidos (pestaña Avanzado), ni en el admin, los feeds RSS o el personalizador.

Pestaña Conexiones — tus plataformas

Introduce aquí los identificadores de las plataformas que usas. Esta base alimenta a la vez el contenedor GTM generado, los píxeles directos y los eventos server-side. Deja vacío lo que no uses.

  • Google Analytics 4: Measurement ID (G-XXXXXXXXXX).
  • Google Ads: Conversion ID (AW-XXXXXXXXX), etiqueta de conversión de compra, remarketing dinámico (opción).
  • Meta: Pixel ID, token de Conversions API, código de prueba CAPI (opción).
  • TikTok: Pixel ID, token de Events API (opción).
  • Pinterest: Tag ID — Snapchat: Pixel ID — LinkedIn: Partner ID.
  • Microsoft Advertising (UET): Tag ID — X: Pixel ID.
  • Hotjar: Site ID — Microsoft Clarity: Project ID.

En la parte inferior de la pestaña, el ajuste Distribución de píxeles selecciona el modo: vía Google Tag Manager (recomendado, importas el contenedor generado) o inyección directa (el plugin carga los píxeles por sí mismo).

Tag Pilot — generar e importar el contenedor GTM

La pestaña Tag Pilot construye un contenedor de Google Tag Manager completo a partir de tus conexiones y lo ofrece para descarga. Genera en particular:

  • la etiqueta de configuración Google de GA4 y una etiqueta de evento GA4 por cada evento activado (con envío de los datos ecommerce desde el dataLayer);
  • el Conversion Linker, la conversión de compra y el remarketing dinámico de Google Ads;
  • el píxel de Meta y sus eventos estándar (ViewContent, AddToCart, InitiateCheckout, AddPaymentInfo, Purchase, Search);
  • etiquetas Custom HTML para TikTok, Pinterest, Snapchat, LinkedIn, Microsoft UET, X, Hotjar y Clarity;
  • las Data Layer Variables y los activadores de eventos personalizados correspondientes.

Para importarlo:

  1. Haz clic en Descargar contenedor GTM (.json).
  2. En Google Tag Manager, abre Administrar > Importar contenedor.
  3. Selecciona el archivo JSON, elige tu espacio de trabajo y luego Fusionar (conserva tus etiquetas existentes) o Sobrescribir.
  4. Previsualiza y luego Enviar y publicar.

En un contenedor existente, prefiere Fusionar para no eliminar tus otras etiquetas.

Modo píxel directo (sin GTM)

Si prefieres no depender de GTM, cambia la distribución a inyección directa en la pestaña Conexiones. El plugin inyecta entonces los píxeles base por sí mismo (GA4, Meta y las demás plataformas configuradas) y reproduce los eventos ecommerce del dataLayer hacia Meta, TikTok, Pinterest, Snapchat y GA4. El mismo dataLayer alimenta ambos enfoques.

No actives el mismo píxel a la vez vía GTM y mediante inyección directa: correrías el riesgo de un doble conteo. Elige un único modo de distribución por plataforma.

Server-side — Meta CAPI y GA4 Measurement Protocol

En la pestaña Server-side, activa el envío de las compras directamente desde tu servidor:

  • Meta Conversions API: requiere el Pixel ID y un token CAPI (pestaña Conexiones). El evento Purchase se envía con datos del cliente con hash SHA-256, las cookies _fbp/_fbc, la dirección IP y el user-agent.
  • GA4 Measurement Protocol: requiere el Measurement ID (Conexiones) y un secreto de API (GA4 > Admin > Flujos de datos > Measurement Protocol).

El navegador y el servidor comparten el mismo event_id determinista por pedido (dfgtm.purchase.<id>). Meta y GA4 lo usan para contar cada conversión una sola vez.

Las solicitudes server-side se envían de forma no bloqueante tras el pago, en los estados «en proceso», «completado» o «pago completado», una sola vez por pedido.

La pestaña Consent activa el Consent Mode v2: se establecen estados de consentimiento denied por defecto antes de cargar el contenedor, con scoping EEA/UK, wait_for_update, URL passthrough y redacción de datos publicitarios. Para actualizar el consentimiento según la elección del usuario, conecta tu banner de cookies a la API JavaScript proporcionada:

// Aceptar todo
window.dfgtmConsent.grantAll();
// Rechazar todo
window.dfgtmConsent.denyAll();
// Actualización detallada
window.dfgtmConsent.update({ ad_storage: 'granted', analytics_storage: 'granted' });

Las Enhanced Conversions de Google Ads (pestaña GA4 Ecommerce) añaden datos del cliente con hash SHA-256 al evento de compra para mejorar la atribución.

Eventos ecommerce de GA4

El plugin envía los siguientes eventos ecommerce de GA4, cada uno activable individualmente, con objetos items completos (item_id desde el SKU o el ID, marca, categorías hasta 5 niveles, variante, precio, descuento):

  • view_item_list, view_item, select_item
  • add_to_cart, remove_from_cart, view_cart
  • begin_checkout, add_shipping_info, add_payment_info
  • purchase (deduplicado: se dispara una vez por pedido, incluso al recargar), search

Hooks para desarrolladores

El plugin expone filtros en los puntos clave para extender su comportamiento sin tocar el núcleo:

  • dfgtm_export_container: modificar el contenedor GTM generado antes de la codificación.
  • dfgtm_meta_capi_payload y dfgtm_ga4_mp_payload: ajustar los payloads server-side.
  • dfgtm_connections_registry: añadir o modificar destinos.
  • dfgtm_purchase_push y dfgtm_build_item: personalizar los datos de compra y la construcción de los items.

FAQ y resolución de problemas

No se inyecta nada del lado de GTM

Comprueba que el ID del contenedor (GTM-XXXXXXX) esté rellenado en la pestaña General y que no hayas iniciado sesión con un rol excluido. El dataLayer y el modo directo funcionan incluso sin contenedor GTM.

Las conversiones se cuentan dos veces en Meta

Asegúrate de no cargar el mismo píxel a la vez vía el contenedor GTM y mediante inyección directa. El server-side y el navegador se deduplican automáticamente por event_id: eso no es una fuente de doble conteo.

El evento de compra no se envía server-side

Comprueba que la opción correspondiente esté activada en la pestaña Server-side y que los identificadores requeridos estén rellenados: Pixel ID + token CAPI para Meta, Measurement ID + secreto de API para GA4. El envío se produce una vez por pedido.

La etiqueta de GA4 no envía los datos ecommerce

En el contenedor generado, las etiquetas de evento GA4 leen los datos ecommerce desde el dataLayer. Si construiste tus etiquetas manualmente, activa «Enviar datos de Ecommerce» y elige «dataLayer» como origen.

¿Qué ocurre al desinstalar?

Si la opción correspondiente está activada en la pestaña Avanzado, los ajustes y los meta de seguimiento de pedidos se eliminan. De lo contrario, se conservan para una posible reinstalación.

¿Te ha resultado útil esta página?

¿Sigues atascado? Contacta con soporte