Cómo crear informes de Web Push en GA4 vía GTM

Esta guía muestra cómo integrar el plugin AI Web Push con Google Tag Manager (GTM) y Google Analytics 4 (GA4). Al final, sabrás cuántas personas se suscribieron, dónde pierdes visitantes en el embudo de permisos, cuál es la tasa de rechazo del prompt nativo, cuántas personas dejaron expirar la solicitud sin responder y cómo monitorear errores técnicos en tiempo real.

Actualizado para la versión 1.9.3 del plugin. La versión 1.9.3 trae dos eventos nuevos, ai_web_push_permission_timeout y ai_web_push_subscription_skipped, y dos valores nuevos en push_source. Lo que cambió con Chrome 155 está en la publicación El aviso de notificación de Chrome cambió en Android.

Importante. Para tener todos los eventos descritos en esta guía, el plugin AI Web Push debe estar en la versión 1.9.3 o superior. Verifica la versión instalada en la página de plugins de tu WordPress. El historial de versiones muestra lo que trajo cada versión y permite descargar el archivo.

¿Por qué monitorear los eventos de Push?

La suscripción a Web Push es un embudo de conversión crítico para cualquier sitio que busque retener audiencia.

• Embudo de permisos. ¿El usuario ve el modal? ¿Hace clic en aceptar? ¿Confirma en el navegador?
• Origen de la conversión. ¿El modal personalizado convierte mejor que el prompt nativo directo?
• Quién no decidió. ¿Cuántos dejaron expirar la solicitud del navegador sin aceptar ni rechazar?
• Monitoreo de errores. Fallas en la comunicación con Firebase o bloqueos del navegador.

El plugin AI Web Push envía 11 eventos de captación a Tag Manager, por la capa de datos (dataLayer), y la tabla de abajo los describe. Si activas la Saída de WebView Meta (Salida de WebView Meta), una función experimental desactivada por defecto, recibes 8 más de esa ventana, que la tabla solo menciona.

Mapeo completo de eventos

Todos los eventos se envían con el prefijo ai_web_push_.

Además de estos 11, existen 8 eventos de salida del navegador de la aplicación (WebView), con nombres que empiezan por ai_web_push_webview_exit_. Solo se disparan si activas la Saída de WebView Meta (Experimental) en Configurações Avançadas (Configuración avanzada) del plugin. Viene desactivada por defecto, vale solo para las páginas que elijas (nunca para la página de inicio) y solo para quien llega desde Instagram, Facebook o Messenger. Cuando existen, los 8 comparten el mismo prefijo, entran en el mismo activador de regex y no forman parte de los informes de este tutorial.

Parámetros enviados

Cada evento llega al dataLayer solo con event, push_provider y push_source. Los dos últimos sirven para filtrar y segmentar. El mensaje técnico del error no va al dataLayer, y solo existe en la captura manual, más abajo.

• push_provider vale siempre ai_web_push. Es útil para filtrar si tienes otros scripts.

• push_source muestra el origen del flujo, con cuatro valores.

  • custom_modal indica que el flujo comenzó por el modal personalizado del plugin.
  • native_prompt indica que el flujo fue directo por el prompt nativo del navegador.
  • site_controls indica que el visitante liberó la notificación después, por los controles del sitio en el navegador. Aparece solo en los eventos de suscripción (subscription_success, subscription_skipped y subscription_error), desde la versión 1.9.3.
  • permission_preexisting indica que el visitante ya había dado el permiso en el navegador, pero todavía no estaba registrado en AI Web Push, y el plugin lo registra en la visita siguiente. Aparece solo en los eventos de suscripción, desde la versión 1.9.3.

Parte 1. Configuración en Google Tag Manager (GTM)

Vamos a configurar GTM para leer estos datos y mandar todo a GA4.

Antes de empezar, tu GTM debe tener GA4 instalado con la Etiqueta de Google, activada en todas las páginas. En Activación, elige el activador Inicialización que se aplica a todas las páginas. En la pantalla, su nombre puede terminar en todos los eventos de inicialización o en todas las páginas. Si tu sitio todavía no tiene GA4, mira el tutorial Cómo poner Google Analytics (GA4) en tu sitio con un plugin, código o GTM. No instales GA4 dos veces, por plugin y por GTM al mismo tiempo. Si tu GA4 ya está en un plugin de Google Analytics, AI Web Push no lo reemplaza, y las páginas de Google que leímos no dicen si la etiqueta de evento funciona sin la Etiqueta de Google en GTM. Usa la función del propio plugin de Google Analytics para pegar el código de GTM, si la tiene, comprueba en la vista previa de GTM y, si tienes dudas, habla con el soporte de AI Web Push.

Google pasó a recomendar, en la página en inglés de Tag Manager, el destino Google Analytics, y dejó la Etiqueta de Google como método alternativo. Las páginas en portugués y en español todavía hablan solo de la Etiqueta de Google. Si tu GTM muestra el aviso para optimizar el contenedor, sigue la pantalla. Por lo que leímos, los dos caminos mandan la misma medición, así que no instales los dos en el mismo contenedor. Google no trata ese punto.

Paso 1. Crear variables de capa de datos

Necesitamos capturar los parámetros que envía el plugin.

1. Ve a Variables, luego Nueva, en el área Variables definidas por el usuario.
2. En Configuración de la variable, elige Variable de capa de datos.
3. Crea las variables de la tabla.

Paso 2. Crear un activador inteligente (regex)

En lugar de crear un activador para cada evento, usaremos una expresión regular (regex) para capturar todos los eventos del plugin de una sola vez. Esto mantiene tu GTM ordenado, y los eventos nuevos de la 1.9.3 ya entran en él sin ningún cambio.

1. Ve a Activadores, luego Nuevo.
2. En Tipo, elige Evento personalizado.
3. En Nombre del evento, escribe ^ai_web_push_.*. El ^ significa "comienza con", y .* significa "cualquier cosa después". Esto captura todos los eventos que el plugin envíe desde tu sitio, los 11 de captación y, si activaste la Saída de WebView Meta, también los 8 de esa ventana.
4. Marca la opción Utilizar una expresión regular que coincida con junto al nombre del evento.
5. Ponle al activador el nombre Evento AI Web Push (todos) y guarda.

Paso 3. Crear la etiqueta genérica de GA4

Ahora una sola etiqueta enviará todos los eventos a GA4, manteniendo el nombre original.

1. Ve a Etiquetas, luego Nueva.
2. Elige el tipo de etiqueta evento de GA4, del grupo Google Analytics. En la pantalla de tu GTM, el selector puede agrupar los tipos de otra forma, así que compruébalo.
3. En ID de medición, informa el ID de tu GA4, el mismo de la etiqueta de Google que ya está instalada. El ID empieza con G.
4. En Nombre del evento, escribe {{Event}}.

5. En Parámetros del evento, agrega los parámetros para el análisis.

   • source con el valor {{dlv push_source}}
   • provider con el valor {{dlv push_provider}}
6. En Activación, elige el activador Evento AI Web Push (todos) que creamos.
7. Haz clic en Guardar. Después haz clic en Enviar y, en la pantalla de envío, en Publicar.

Consejo. Usando la variable automática {{Event}}, GA4 recibe el nombre exacto del evento, como ai_web_push_subscription_success. Si quieres limpiar el nombre y quitar el prefijo, puedes crear una variable de tabla de regex en GTM, pero enviar el nombre original es más simple y funciona perfectamente.

Parte 2. Configuración en Google Analytics 4 (GA4)

Ahora los datos están llegando a GA4. Vamos a organizar lo que llegó.

1. Marcar el evento clave

El evento más importante es ai_web_push_subscription_success.

1. En GA4, ve a Administrador, luego Visualización de datos, luego Eventos.
2. En la lista, busca ai_web_push_subscription_success y haz clic en la estrella junto a él. La estrella marca el evento como evento clave. Algunas páginas de Google todavía lo llaman conversión.
3. Si el evento todavía no está en la lista, Google también habla de marcar un evento nuevo como evento clave en esa pantalla. Comprueba el botón en tu pantalla.

Ahora cada suscripción enviada cuenta como evento clave en tus informes de adquisición y de engagement. Recuerda que subscription_success marca el envío del registro, y no la confirmación del servidor. No marques ai_web_push_subscription_skipped como evento clave, porque indica un navegador que ya estaba registrado.

2. Crear la dimensión personalizada (opcional, pero recomendado)

Para usar el parámetro source en los informes, debes registrar ese parámetro.

1. Ve a Administrador, luego Visualización de datos, luego Definiciones personalizadas.
2. Crea una dimensión personalizada con el nombre Push Source y el parámetro del evento source.

Parte 3. Informes avanzados (Explorar)

Aquí creas visualizaciones que el informe estándar no muestra.

Informe 1. El embudo de permisos real

Descubre dónde abandonan los usuarios.

1. En GA4, ve a Explorar y abre una exploración en blanco.
2. Elige la técnica Exploración de embudo.

3. Configura las etapas.

   • Etapa 1 (Vio), evento ai_web_push_modal_shown O ai_web_push_prompt_shown.
   • Etapa 2 (Interactuó), evento ai_web_push_modal_accepted.
   • Etapa 3 (Permitió), evento ai_web_push_permission_granted.
   • Etapa 4 (Se suscribió), evento ai_web_push_subscription_success.

Resultado. Ves la tasa de abandono (drop off) en cada etapa.

Este embudo sirve a los sitios con el modal personalizado activado. En la solicitud directa del navegador, sin modal, la etapa 2 no existe y el flujo va de ai_web_push_prompt_shown en adelante. En ese caso, arma el embudo solo con las etapas 1, 3 y 4.

Informe 2. Comparativo de origen

¿Qué camino genera más suscriptores?

1. Crea una Exploración de formato libre.
2. En Filas, arrastra la dimensión Push Source.
3. Filtra por el evento ai_web_push_subscription_success y, en Valores, coloca Recuento de eventos.

Resultado. Una tabla que compara cuántos suscriptores llegaron por custom_modal, native_prompt, site_controls y permission_preexisting. Los dos últimos valores solo existen desde la versión 1.9.3 y muestran quién liberó la notificación después, por los controles del sitio, y quién ya tenía el permiso de antes.

Informe 3. Monitoreo de errores

¿Tus usuarios están teniendo problemas técnicos?

1. Crea una Exploración de formato libre.
2. Filtra por el evento ai_web_push_subscription_error.
3. En Filas, coloca la dimensión Nombre del evento. Si quieres ver dónde ocurren los errores, agrega una dimensión de página o de navegador, de la lista de dimensiones de la exploración.
4. En Valores, coloca Recuento de eventos.

Resultado. Ves cuántos errores de suscripción ocurrieron y, con la dimensión agregada, en qué páginas o navegadores. El mensaje técnico del error no llega a GA4. Para leerlo, usa la captura manual, más abajo.

Informe 4. Quién rechazó y quién no decidió

Desde la versión 1.9.3, la solicitud que expira o se cierra sin respuesta va a ai_web_push_permission_timeout, y el rechazo de verdad queda en ai_web_push_permission_denied.

1. Crea una Exploración de formato libre.
2. Filtra por los eventos ai_web_push_permission_denied y ai_web_push_permission_timeout.
3. En Filas, coloca la dimensión Nombre del evento.
4. En Valores, coloca Recuento de eventos.

Resultado. Ves por separado quién rechazó y quién dejó la solicitud terminar sin respuesta, y ese segundo grupo todavía puede aceptar después. Para comparar con el período anterior a la versión 1.9.3, suma los dos, porque antes de ella los dos casos quedaban en el mismo evento.

Captura manual vía JavaScript (para desarrolladores)

Si no usas GTM y quieres enviar los datos directamente a tu CRM, tu base de datos u otra herramienta de analítica, usa el sistema de eventos del plugin. El objeto global aiWebPushFront tiene un método on() para escuchar eventos.

// Exemplo, enviar a inscrição para o seu backend ou CRM
if (window.aiWebPushFront) {
    window.aiWebPushFront.on('subscription_success', function(detail) {
        console.log('Usuário inscrito', detail);
        fetch('/minha-api/registrar-push', {
            method: 'POST',
            body: JSON.stringify({
                source: detail.source
            })
        });
    });

    // Exemplo, monitorar erros
    window.aiWebPushFront.on('subscription_error', function(detail) {
        console.error('Erro no push', detail.error);
    });
}

El detail de subscription_success trae el origen, en detail.source. subscription_skipped trae también detail.reason, y subscription_error trae detail.error, el mensaje técnico del error, que no va al dataLayer.

Los eventos de suscripción disponibles para on() son browser_not_supported, modal_shown, modal_accepted, modal_dismissed, prompt_shown, permission_granted, permission_denied, permission_timeout, subscription_success, subscription_skipped y subscription_error. El on() recibe también push_received_while_away, que solo llega a quien escucha por on() y no va al dataLayer, y los 8 eventos webview_exit_*, si la Saída de WebView Meta está activada.

Cómo depurar y probar

No publiques sin probar.

1. Activa el modo debug del plugin. Abre la consola del navegador (F12), escribe el comando de abajo y recarga la página. El plugin pasa a mostrar registros de colores en la consola para cada etapa.

localStorage.setItem('ai-web-push-debug', 'true');

2. Usa la vista previa de GTM. Haz clic en Vista previa en GTM, conéctate a tu sitio y haz el flujo de suscripción. En el Tag Assistant, verifica si los eventos ai_web_push_* aparecen en la barra lateral izquierda y si se disparó la etiqueta de GA4.
3. Usa el DebugView de GA4. Ve a Administrador, luego Visualización de datos, luego DebugView. El DebugView pide el modo de depuración activado. Deberías ver los eventos llegando en tiempo real en la línea de tiempo.

Deja el debug apagado en producción y actívalo solo para investigar un problema.

Resumen de los archivos involucrados

• Plugin. Emite los eventos en el dataLayer.
• GTM. Captura los eventos mediante el activador de regex y los envía a GA4.
• GA4. Procesa los datos, marca los eventos clave y genera los informes.

Con esta configuración, tienes un observatorio de la salud y del rendimiento de las suscripciones a Web Push. Para ver lo que pasa después del clic en la notificación, incluidos los ingresos por anuncios, mira el tutorial Cómo ver los ingresos de tus notificaciones push (UTM, GA4 y Ad Manager). Los eventos y los escenarios de prueba del plugin están en la publicación AI Web Push y Google Tag Manager.

Para leer en Google

• Configurar eventos de Google Analytics en Google Tag Manager
• Configurar Google Analytics en Google Tag Manager
• Marcar eventos como eventos clave
• Crear dimensiones personalizadas de ámbito de evento
• Exploración de embudo
• Exploración de formato libre
• Supervisar eventos en DebugView

Las páginas de Google citadas se consultaron el 14 de octubre de 2026.