Hoe folgje Elementor -formulierynstjoeringen yn Google Analytics -eveneminten mei JQuery

Hoe folgje Elementor -formulierynstjoeringen yn Google Analytics -eveneminten

Ik haw de lêste wiken wurke oan in WordPress -side foar kliïnten dy't nochal wat kompleksiteiten hat. Se brûke WordPress mei in yntegraasje nei ActiveCampaign foar it fersoargjen fan leads en a Zapier yntegraasje oan Zendesk Ferkeapje fia Elementor Forms. It is in geweldich systeem ... dripkampanjes úteinsette foar minsken dy't ynformaasje freegje en in foarsprong nei de passende ferkeapfertsjintwurdiger drukke as dat wurdt frege. Ik bin wirklik ûnder de yndruk fan Elementor's foarmflexibiliteit en uterlik en gefoel.

De lêste stap wie it leverjen fan in analytysk dashboard foar de kliïnt fia Google Analytics dy't har prestaasjes fan moanne oant moanne levere op formulierynstellingen. Se hawwe Google Tag Manager ynstalleare, dus wy fange al e-commerce transaksjes en YouTube-werjefteaktiviteit op 'e side.

Ik haw ferskate pogingen dien om DOM, triggers en eveneminten te brûken binnen Google Tag Manager om de suksesfolle yntsjinjen fan formulieren foar Elementor op te nimmen, mar hie hielendal gjin gelok. Ik testte in protte ferskillende manieren om de side te kontrolearjen, seach nei it suksesberjocht dat soe ferskine fia AJAX en it wurke gewoan net. Dat ... ik haw wat socht en fûn in geweldige oplossing fan Tracking Chef, neamd Bulletproof Elementor formulier tracking mei GTM.

It skript brûkt jQuery en Google Tag Manager om de Google Analytics -evenemint as it formulier mei súkses wurdt yntsjinne. Mei wat lytse bewurkings en ien ferbettering fan syntaksis hie ik alles wat ik nedich wie. Hjir is de koade:

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

It is aardich yngenieus, sjoch nei de suksesfolle yntsjinjen, dan foarby Foarm as de kategory, de bestimmingsnamme as de Aksje, en Submission as it label. Troch it doel programmatysk te meitsjen, kinne jo dizze koade gewoan yn 'e foettekst fan elke pagina hawwe om in yntsjinjen fan formulier te observearjen. Dat ... as jo formulieren tafoegje of feroarje, hoege jo noait soargen te meitsjen oer it bywurkjen fan it skript noch it tafoegjen oan in oare pagina.

Ynstallearje it skript fia Elementor oanpaste koade

As jo ​​in buro binne, soe ik de unbeheinde upgrade en it brûken fan Elementor sterk oanbefelje foar al jo kliïnten. It is in solide platfoarm en it oantal partneryntegraasjes bliuwt skyrocket. Koppel it mei in Plugin lykas Kontaktformulier DB en jo kinne ek al jo formulierynstellingen sammelje.

Element Pro hat in geweldige opsje foar skriptbehear direkt ynboud. Hjir is hoe't jo jo koade kinne ynfiere:

Elementor Oanpaste koade

  • Gean nei Elementor> Oanpaste koade
  • Namme jo koade
  • Stel de lokaasje yn, yn dit gefal it ein body tag.
  • Stel in prioriteit yn as jo mear dan ien skript hawwe dat jo wolle ynfoegje en set de folchoarder derfan yn.

Elementor Form Submission oan GA Event fia GTM

  • Klikje op fernijing
  • Jo wurde frege de betingst yn te stellen en gewoan op 'e standert fan alle siden te setten.
  • Ferfarskje jo cache en jo skript is live!

Foarbyld fan jo Google Tag Manager -yntegraasje

Google Tag Manager hat in fantastysk meganisme foar ferbining mei in browserynstânsje en eins testen fan jo koade om te observearjen oft de fariabelen goed ferstjoerd binne. Dit is essensjeel om't Google Analytics gjin real-time is. Jo kinne teste en testen en testen en wirklik frustreare wurde dat de gegevens net ferskine yn Google Analytics as jo dit net wisten.

Ik sil hjir gjin tutorial jaan oer hoe foarbyld en debugge Google Tag Manager... Ik sil oannimme dat jo it witte. Ik kin myn formulier yntsjinje op myn oansletten testside en sjoch de gegevens nei de GTM -gegevens stjoerd sa't it moat wêze:

google tag manager gegevenslaach

Yn dit gefal wie de kategory hurd kodearre as Formulier, it doel wie it Kontaktformulier, en it label is Submission.

Yn Google Tag Manager gegevensfariabelen, evenemint, trigger, en tag ynstelle

De lêste stap hjirop is it ynstellen fan Google Tag Manager om dy fariabelen op te nimmen en te stjoeren nei in Google Analytics Tag ynsteld foar in evenemint. Elad Levy beskriuwt dizze stappen yn syn oare post - Generic tracking fan eveneminten yn Google Tag Manager.

As dizze ienris binne ynsteld, kinne jo de eveneminten sjen yn Google Analytics!

Krij Elementor Pro

Bekendmakking: ik brûk myn affiliate links yn dit artikel.

6 Comments

  1. 1
  2. 3
  3. 5

Wat tinksto?

Dizze side brûkt Akismet om spam te ferleegjen. Learje hoe't jo kommentaargegevens ferwurke wurde.