Análise e probasMarketing de Contido

Como rastrexar os envíos de formularios Elementor en eventos de Google Analytics usando JQuery

Durante as últimas semanas estiven a traballar nun sitio cliente de WordPress que ten bastantes complexidades. Están a usar WordPress cunha integración a ActiveCampaign para nutrir pistas e a Zapier integración a Vender Zendesk vía Formas Elementor. É un sistema estupendo ... iniciar campañas de goteo para as persoas que solicitan información e dirixir o representante de vendas correspondente cando o soliciten. Impresionou moito a flexibilidade e o aspecto de Elementor.

O último paso foi proporcionar un panel de análise para o cliente a través de Google Analytics que lles proporcionou rendemento mes a mes nos envíos de formularios. Teñen o Xestor de etiquetas de Google instalado, polo que xa estamos capturando transaccións de comercio electrónico e actividade de visualización de YouTube no sitio.

Fixen varios intentos por utilizar DOM, disparadores e eventos no Xestor de etiquetas de Google para capturar o envío correcto do formulario para Elementor, pero non tiven ningunha sorte. Probei unha chea de xeitos diferentes de controlar a páxina, observando a mensaxe de éxito que aparecería a través de AJAX e simplemente non funcionaba. Entón ... fixen unha procura e atopei unha excelente solución de Tracking Chef, chamada Seguimento de formularios a proba de balas con GTM.

O guión utilízase jQuery e Google Tag Manager para empurrar o Evento de Google Analytics cando o formulario se envía con éxito. Con algunhas modificacións menores e unha mellora da sintaxe, tiven todo o que necesitaba. Aquí tes o código:

<script>
jQuery(document).ready(function($) {
    $(document).on('submit_success', function(evt) {
      window.dataLayer = window.dataLayer || [];
      window.dataLayer.push({
            'event': 'ga_event',
            'eventCategory': 'Form ',
            'eventAction': evt.target.name,
            'eventLabel': 'Submission'
        });
    });
});
</script>

É bastante enxeñoso, observando a presentación correcta e logo aprobando Forma como a categoría, o nome do destino como a Acción, e Submisión como a etiqueta. Ao facer o destino programático, pode simplemente ter este código no pé de páxina de cada páxina para observar o envío dun formulario. Entón ... mentres engades ou modificas formularios, nunca tes que preocuparte por actualizar o script nin engadilo a outra páxina.

Instala o script vía código personalizado Elementor

Se es unha axencia, recomendaríache a actualización ilimitada e o uso de Elementor para todos os teus clientes. É unha plataforma sólida e o número de integracións de socios segue disparándose. Acompáñao cun complemento como Formulario de contacto DB e tamén podes recoller todos os teus formularios.

Element Pro ten unha excelente opción de xestión de scripts integrada. Aquí podes introducir o teu código:

Código personalizado Elementor
  • desprácese ata Elementor> Código personalizado
  • Nomea o teu código
  • Estableza a situación, neste caso o final etiqueta corporal.
  • Definir unha prioridade se ten máis dun script que desexa inserir e axustar a súa orde.
Envío de formulario Elementor ao evento GA a través de GTM
  • Fai clic en actualizar
  • Pediráselle que estableza a condición e que a estableza como predeterminada en todas as páxinas.
  • Actualiza a túa caché e o teu script está en directo.

Previsualice a súa integración de Google Tag Manager

Google Tag Manager ten un fantástico mecanismo para conectarse a unha instancia do navegador e probar o seu código para observar se as variables se envían correctamente ou non. Isto é esencial porque Google Analytics non é en tempo real. Podes probar, probar e probar e sentirte frustrado de que os datos non aparezan en Google Analytics se non te decatas disto.

Aquí non vou proporcionar un tutorial sobre como facelo previsualizar e depurar o Xestor de etiquetas de Google... Vou supor que o sabes. Podo enviar o meu formulario na miña páxina de proba conectada e ver os datos enviados aos datos de GTM como deben ser:

capa de datos do xestor de etiquetas de google

Neste caso, a categoría foi codificada como Formulario, o obxectivo era o formulario Contacte connosco e a etiqueta é Envío.

En Xestor de etiquetas de Google configura as variables de datos, o evento, o disparador e a etiqueta

O último paso é configurar Google Tag Manager para capturar esas variables e envialas a unha etiqueta de Google Analytics configurada para un evento. Elad Levy detalla estes pasos no seu outro post - Seguimento xenérico de eventos no Xestor de etiquetas de Google.

Unha vez configurados, poderás ver os eventos en Google Analytics.

Obtén Elementor Pro

Divulgación: estou a usar as miñas ligazóns de afiliados ao longo deste artigo.

Douglas Karr

Douglas Karr é CMO de OpenINSIGHTS e o fundador da Martech Zone. Douglas axudou a decenas de startups exitosas de MarTech, axudou na debida dilixencia de máis de 5 millóns de dólares en adquisicións e investimentos en Martech e segue axudando ás empresas a implementar e automatizar as súas estratexias de vendas e mercadotecnia. Douglas é un experto e relator de MarTech en transformación dixital recoñecido internacionalmente. Douglas tamén é autor publicado dunha guía de Dummie e dun libro de liderado empresarial.

artigos relacionados

Botón de volta ao principio
preto

Adblock detectado

Martech Zone pode fornecerche este contido sen ningún custo porque monetizamos o noso sitio mediante ingresos publicitarios, ligazóns de afiliados e patrocinios. Agradeceríamos que elimines o teu bloqueador de anuncios mentres visitas o noso sitio.