Reputation: 15
In the header of every page I have the following integration code from Google Analytics:
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXXX-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXXXXX-1');
</script>
XXXXXXXXX is obviously replaced with our ID.
In the footer of a page where contact form exists, I have placed the following code:
document.addEventListener( 'wpcf7mailsent', function( event ) {
ga( 'send', {
hitType: 'event',
eventCategory: 'contact-form',
eventAction: 'contact-form-submission-mailsent',
eventLabel: 'Contact CTA'
});
});
The listener works well, and has been tested with console.log after a successful submit. However, no event is visible in Google Analytics under "Behavior" -> "Events". There are no other customizastion in Google Analytics, it is pretty basic.
Any help or guidance is much appreciated.
Upvotes: 0
Views: 1376
Reputation: 14197
You can't mix Universal Analytics code and gtag code. If you have in head
gtag snippet, you have to use its syntax for send an event:
gtag('event', <action>, {
'event_category': <category>,
'event_label': <label>,
'value': <value>
});
https://developers.google.com/analytics/devguides/collection/gtagjs/events
Upvotes: 1