Wéi verfollegen Elementor Form Soumissiounen a Google Analytics Eventer mat JQuery

Wéi verfollegen Elementor Form Soumissiounen a Google Analytics Eventer

Ech hunn an de leschte Wochen un engem Client WordPress Site geschafft, deen zimmlech vill Komplexitéiten huet. Si benotzen WordPress mat enger Integratioun zu ActiveCampaign fir Leaders ze këmmeren an a Zapier Integratioun ze Zendesk Verkafen via Elementor Formen. Et ass e super System ... Drëppekampagnen unzefänken fir Leit déi Informatioun froen an e Virsprong op den entspriechende Verkafsvertrieder drécken wann se gefrot ginn. Ech si wierklech beandrockt mat der Elementor Form Flexibilitéit a Look a Feel.

De leschte Schrëtt war en Analytics Dashboard fir de Client iwwer Google Analytics ze liwweren, deen hinnen e Mount-iwwer-Mount Leeschtung op Form Soumissioune geliwwert huet. Si hunn de Google Tag Manager installéiert, sou datt mir scho E-Commerce Transaktiounen erfëllen an YouTube View Aktivitéit um Site.

Ech hunn e puer Versich gemaach fir DOM, Trigger, an Eventer am Google Tag Manager ze benotzen fir déi erfollegräich Form Soumissioun fir Elementor z'erreechen awer hat kee Gléck. Ech hunn eng Tonn vu verschiddene Weeër getest fir d'Säit ze iwwerwaachen, no der Erfollegsmeldung ze kucken, déi iwwer AJAX opdaucht an et funktionnéiert just net. Also ... Ech hunn e bësse gesicht an hunn eng super Léisung vum Tracking Chef fonnt, genannt Bulletproof Elementor Form Tracking mat GTM.

De Skript benotzt jQuery a Google Tag Manager fir den Google Analytics Event wann d'Form erfollegräich presentéiert gëtt. Mat e puer klengen Ännerungen an enger Syntaxverbesserung hat ech alles wat ech gebraucht hunn. Hei ass de Code:

<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>

Et ass zimmlech genial, kuckt no der erfollegräicher Soumissioun, dann laanscht Form wéi d'Kategorie, de Destinatioun Numm wéi d'Aktioun, an Soumissioun wéi de Label. Wann Dir den Zil programmatesch maacht, kënnt Dir dëse Code einfach am Fousszeilen vun all Säit hunn fir eng Form Soumissioun ze beobachten. Also ... wéi Dir Formen derbäigesat oder ännert, musst Dir Iech keng Suergen iwwer d'Skriptupdate maachen oder et op eng aner Säit derbäisetzen.

Installéiert de Skript Via Elementor Custom Code

Wann Dir eng Agentur sidd, géif ech den onlimitéierten Upgrade empfeelen an Elementor fir all Är Clienten benotzen. Et ass eng zolidd Plattform an d'Zuel vun de Partnerintegratiounen klëmmt weider. Koppel et mat engem Plugin wéi Kontaktformular DB an Dir kënnt och all Är Form Soumissiounen sammelen.

Element Pro huet eng super Skriptmanagement Optioun direkt agebaut. Hei ass wéi Dir Äre Code aginn kënnt:

Elementor Benotzerdefinéiert Code

  • navigéiert ze Elementor> Benotzerdefinéiert Code
  • Numm Äre Code
  • Setzt d'Location, an dësem Fall d'Enn body tag.
  • Setzt eng Prioritéit wann Dir méi wéi ee Skript hutt deen Dir wëllt aginn a setzt d'Bestellung vun hinnen.

Elementor Form Soumissioun op GA Event iwwer GTM

  • Klickt op Update
  • Dir wäert gefrot ginn d'Conditioun ze setzen an et just op de Standard vun alle Säiten ze setzen.
  • Frësch Äre Cache an Äre Skript ass live!

Preview Är Google Tag Manager Integratioun

Google Tag Manager huet e fantastesche Mechanismus fir mat engem Browser Instanz ze verbannen an tatsächlech Äre Code ze testen fir ze kucken ob d'Variabelen richteg geschéckt ginn oder net. Dëst ass wesentlech well Google Analytics net Echtzäit ass. Dir kënnt testen an testen an testen a wierklech frustréiert ginn datt d'Donnéeën net a Google Analytics ugewise ginn wann Dir dëst net realiséiert hutt.

Ech ginn hei keen Tutorial fir wéi Virschau an Debug Google Tag Manager... Ech ginn un datt Dir wësst. Ech kann mäi Form op menger verbonne Test Säit ofginn an d'Donnéeë gesinn op d'GTM Daten gedréckt wéi se musse sinn:

Google Tag Manager Dateschicht

An dësem Fall war d'Kategorie schwéier kodéiert als Form, d'Zil war de Kontaktéiert eis Form, an de Label ass Soumissioun.

Am Google Tag Manager Setzt Datevariabelen, Event, Ausléiser an Tag op

De leschte Schrëtt op dësem ass de Google Tag Manager opzemaachen fir dës Variabelen z'erreechen an se an e Google Analytics Tag ze schécken deen fir en Event ageriicht ass. Den Elad Levy detailléiert dës Schrëtt a sengem anere Post - Generesch Event Tracking Am Google Tag Manager.

Wann dës agestallt sinn, kënnt Dir d'Evenementer a Google Analytics gesinn!

Kritt Elementor Pro

Verëffentlechung: Ech benotze meng Filiallink am ganzen Artikel.

6 Comments

  1. 1
  2. 3
  3. 5

Wat denks du?

Dëse Site benotzt Akismet fir Spam ze reduzéieren. Léiert wéi Är Kommentarfaten veraarbecht ginn.