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.
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
Related
I am in need of assistance. I am trying to implement Custom Event Tracking for a form submission as both an Analytics Goal, and a Conversion Goal for Google Optimize.
Here is a screenshot of the Google Analytics Goal:
I have my Google Analytics in the head (with sensitive information redacted with XXXXX) as such:
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=XXXXXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'XXXXXXXXXXX', { 'optimize_id': 'XXXXXXXXXXX'});
</script>
And then I have tried to fire the custom event with both:
ga('send', {
hitType: 'event',
eventCategory: 'mailchimp',
eventAction: 'subscribe',
eventLabel: 'soft-lead-form'
});
and also:
gtag('event', 'play', {
'event_category': 'mailchimp',
'event_label': 'soft-lead-form'
});
I have confirmed that analytics is instanced effectively by writing to the console with:
if (gtag) {
console.log("ga present");
}
And I have confirmed that the user action triggers the ga call by writing to the console in the same function with:
$("#mc-embedded-subscribe-form").submit(function(){
gtag('event', 'play', {
'event_category': 'mailchimp',
'event_label': 'soft-lead-form'
});
console.log("ga Event Submitted");
});
I would GREATLY APPRECIATE any help. I've been through pages of documentation and, despite trying/testing multiple points in this process, I can not get the event to appear in Either Analytics or Optimize. This is a crucial piece for our marketing efforts and I very much want to make it work.
Thank you so much!
Gary
Surely the event with ga(...) you have to remove it because you are using gtag.
If you are seeing the events real time, then you need to wait for at least 24-72 hrs to get the data updated under Behaviour -> Events -> Overview.
In the past I used a Google Analytics Custom Report to track the amount of pageviews per author and number of pageviews per forum topic category which I had setup like this in Google Analytics (analytics.js):
The code I used to push this data to Google Analytics was simple ga('set', 'dimension1', 'Name of Author');
I've updated my Google Analytics javascript snippet to gtag but I can't seem to push the data in the same way.
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-xxxxx"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-xxxxx',
{ 'anonymize_ip': true,
'forceSSL': true,
'custom_map': {'dimension1': 'author', 'dimension4': 'forum_name'}
});
gtag('event', 'author', {'event_category': 'Writers', 'event_label': 'Author Name'});
gtag('event', 'forum_name', {'event_category': 'Forum category', 'event_label': 'Forum Category name'});
</script>
At the moment I am getting the data as an event in Google Analytics. But the way the code works right now makes it much harder to analyse the data. In the past I could click on an authors name and see which pages got the most pageviews and for the forum category it was the same. I could dig in and see per category the urls that brought in the most visitors.
I think the difference between the two code snippets is that ga 'set' was sent as a virtual pageview where the net gtag 'event' is an event and not an virtual pageview. The question now is how to setup a similar custom report as I has previously or how to update the code snippet to get a similar result as in the past?
Update
This is the old version of Google Analytics and the code I've been using:
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXXX', 'auto');
ga('set', 'dimension1', 'Author Name');
ga('set', 'dimension4', 'Forum name');
ga('require', 'ec');
ga('set', 'anonymizeIp', true);
ga('set', 'forceSSL', true);
ga('send', 'pageview');
</script>
After a lot of testing I finally found the answer to my own question. The trick seems to be to add the dimensions in the config so they are send as a pageview.
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-xxxxx"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-xxxxx',
{ 'anonymize_ip': true,
'forceSSL': true,
'dimension1': 'Author Name', 'dimension4': 'Forum category'
});
</script>
Based on your analytics.js code, the set command sets the custom dimensions and their given value so that they persist and send with all/any hits within the page. The example code snippet that was being used for analytics.js, is sending the cd's along with the default pageview.
Try instead
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('set', {'dimension1': 'Author Name', 'dimension4': 'Forum name'});
gtag('config', 'UA-xxxxx',
{ 'anonymize_ip': true,
'forceSSL': true
});
</script>
If you have any onclick or other events being sent within the page, or virtual pageviews being sent within the page, it will also send the above custom dimensions and their set values with those too.
After doing some testing custom_map doesnt appear to be necessary (however it may come into play with the new app+web properties and possibly where the gtag.js snippet is used for multiple products and custom parameters need to be mapped).
Not sure, however I found custom_map somewhat strange in it's behaviour when i did some testing with it.
I've looked at countless answers but been unable to find the right solution. I'm trying to get Google analytics to register a goal once a contact number has been clicked, using an event registration (onclick).
I've got the following code, which is not registering any results. What's the thing I'm missing?
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXX-XX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXX-XX');
</script>
onclick="gtag('event', 'click', { 'send_to': 'UA-XXXXXX-XX', eventCategory: 'Telefoon ', eventAction: 'click', eventLabel: 'Telefoonnummer aangeklikt', eventValue: 1});"
The syntax for the onclick code is incorrect.
send_to is not necessary if only a single tracking code is being used on the site. If more than one tracking code is in use then you can configure it to send (or route) data to individual GA Properties or groups of accounts or products.
Ref: https://developers.google.com/gtagjs/devguide/routing
event tracking syntax is the following:
gtag('event', 'action', {'event_category': 'category', 'event_label': 'label', 'value': value});
ref: https://developers.google.com/analytics/devguides/collection/gtagjs/events
event_label and value are optional.
The following should work for your link
onclick="gtag('event', 'click', { 'event_category': 'Telefoon', 'event_label':'Telefoonnummer aangeklikt', value: 1 });"
I am trying to get statistics about sign ups on my website.
The analytics code is in the header:
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=...."></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', '....');
</script>
Then I have a form and sending it (with a page reload, not ajax) and in the success snippet in razor I placed the ga code:
#if (success)
{
<script type="text/javascript">
ga('send', 'event', 'Supplier sign up', 'click', '/signup/success');
</script>
<p>success message</p>
}
The success message appears and I can see the script in the page inspect but I don't get any stats in Google Analytics.
Am I missing something? In the past (a few years ago) I was using a similar code and it worked. Has anything changed recently? Do I need to enable something in the Analytics or my code is wrong?
I am following the documentation:
https://developers.google.com/analytics/devguides/collection/analyticsjs/events
https://developers.google.com/analytics/devguides/collection/analyticsjs/pages
The implementation method for your GA is through gtag.s, not GTM or analytics.js.
Thus you need to modify your success to:
#if (success)
{
<script type="text/javascript">
gtag('event', 'click', {'event_category': 'Supplier sign up', 'event_label': '/signup/success'});
</script>
<p>success message</p>
}
You have mixed two GA libraries. You use gtag.js for page view, so you need to use gtag.js (not analytics.js) for events.
https://developers.google.com/analytics/devguides/collection/gtagjs/events
I am using the following code; Unfortunately, this is not recording any goals and i cannot see why. When using the console to troubleshoot it is saying;
Uncaught SyntaxError: Invalid or unexpected token. It looks like this line is the problem (onClick=”ga(‘send’, ‘event’, { eventCategory:)but i cannot see why. Any advice would be a great help.
Thanks
Dan
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-125974947-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-125974947-1');
onClick=”ga(‘send’, ‘event’, { eventCategory:
‘Contact’, eventAction: ‘Submit’, eventLabel:
‘Godwin Form’});”
</script>
Events are coded a little differently with the new gtag syntax. If you test below, it may fix the issue:
gtag('event', 'Submit', {
'event_category': 'Contact',
'event_label': 'Godwin Form'
});