I want to be able to capture the full URL on a single page application SPA and that includes the hashtag. My GA tracking code is below. It’s capturing the full URL including the #index for the home page but when I click on the About button for example the URL that gets sent to GA doesn’t change. The url should now end with #about. The tracking code is below. How do I fix this so that when they click the other buttons the URL changes.
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXX-XX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXXX-XX', {'page_path': location.pathname + location.hash});
</script>
You need to add the following to your routing:
gtag('event', 'page_view',{'page_path': location.pathname + location.hash});
Related
We have a single page application using Gtag (Global Site Tag), and we manage the tracking of pages manually to provide the correct page names that we want to track. So we call
gtag('config', gaPropertyId, gtagPageConfig)
every time there is a route change.
This means that we don't want gtag to track pages for us automatically, as we are currently tracking all initial pages twice. The first is when gtag is automatically firing the tracking of the page by sending the browser title and the URL, and the second time is when we trigger the page view from our code, to provide the title for that page that we want to have see in Google Analytics.
After a lot of research and debugging, I've narrowed it down to the settings screen, where "Page loads" is checked, and can't be disabled, see this image:
We load our script like this:
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-xxx-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-xxx', { 'send_page_view': false });
</script>
When I remove the line gtag('js', new Date());, it doesn't track the page anymore, but this will probably result in some unwanted behaviour.
Is there a way for us to prevent the initial page load tracking? I've searched everywhere, but can't find the solution.
Simply you should NOT include those fields on pages you don't want to send any data to Google:
gtag('js', new Date());
gtag('config', 'G-xxx');
Your snippet should look like this without date and config:
<script async src="https://www.googletagmanager.com/gtag/js?id=G-xxx"></script>
<script>window.dataLayer = window.dataLayer || [];function gtag(){dataLayer.push(arguments);}
Sending data
SPA (i.e. Vue, React, etc)
If you are using SPA (i.e. Vue, React), you can run gtag function after route updated:
gtag('js', new Date());
gtag('config', 'G-xxx', { page: path: route.path, page_title: route.meta.title })
PHP
You can show up date and config conditionally:
<?php if (/* suits my needs*/): ?>
gtag('js', new Date());
gtag('config', 'G-xxx');
<?php endif; ?>
Documentation says about measure pageviews:
To disable the default pageview hit, set the send_page_view parameter to false in the gtag.js snippet.
gtag('config', 'GA_MEASUREMENT_ID', {
send_page_view: false
});
https://developers.google.com/analytics/devguides/collection/gtagjs/pages
I'm using gtag.js to track Google Ads.
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-abc123"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-abc123');
</script>
This is the code to trigger my Google Ads Conversion Tracking pixel:
var callback = function () {
if (typeof(url) != 'undefined') {
window.location = url;
}
};
gtag('event', 'conversion', {
'send_to': 'AW-abc123/12345',
'event_callback': callback
});
When I load my page with a fresh cache, I can see my conversion pixel being fired:
However, after a page reload, the conversion no longer fires:
What is causing the conversion tag to stop firing?
Why do you think that tag doesn't fire? Blue color in Tag Assistant indicates non-standard implementation etc. Try to click on your tag in Tag Assistant and see details.
While I see some numbers on the "Real-Time overview" page, I don't see the pageviews / sessions data in "Audience overview" on my website. I'm having a hard times understanding why.
The website is: https://everyelixirvideo.page/. It's a single-page website with no custom javascript. This is the current tracking code:
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-33420511-4"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-33420511-4');
gtag('config', 'UA-33420511-4', {'page_path': "/"});
</script>
What am I missing?
Here are the screenshot of "Real-Time overview" and "Audience overview" pages:
good:
not good:
Having some issues with the implementation of cross domain tracking with the Gtag.js. I'm trying to do CDT for a restaurant website which has an external booking system with a 5 different URLs (1 for each restaurant booking system). I'm using the same GA property, but have failed to figure out if the Gtag.js is set up correctly. Here's what I have on the restaurant business domain:
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXX-
1">
</script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXXX-1', {
'linker': {
'domains' [
'https://restaurant.bookingpage1.com',
'https://restaurant.bookingpage2.com',
'https://restaurant.bookingpage3.com',
'https://restaurant.bookingpage4.com',
'https://restaurant.bookingpage5.com']
}
});
</script>
Then, on the restaurant.bookingpage1-5, I should implement:
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-
XXXXXXX-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXXX-1', {
'linker': {
'accept_incoming': true
}
});
</script>
Afterwards, I implemented the restaurant main domain as a referral exclusion in Analytics.
Can anyone see if this is correctly set up?
You missed the colon after domains
gtag('config', 'UA-XXXXXXX-1', {
'linker': {
'domains' [
Our goal here is to keep Google Analytics conversion goal tracking data when we load an iframe from another domain name that we own.
We have a domain rentalbookingsoftware.com that on the free trial page: https://rentalbookingsoftware.com/free-trial-signup/ loads an iframe for our free trial installer from sidev2.info like this:
<iframe width="80%" height="500" src="https://sidev2.info/freetrialform.php"></iframe>
We are trying to keep the gtag.js clientid the same but a new session is started on the sidev2.info gtag tracking which causes the correct referrer information to be lost as you can see from the gtag recording: https://www.screencast.com/t/l5wsqUF6oAg . Both sites are using this tracking code as suggested from: https://developers.google.com/analytics/devguides/collection/gtagjs/cross-domain and I have added sidev2.info to the referrer exclusion list: https://support.google.com/analytics/answer/2795830
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-45446232-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-45446232-1', {
'linker': {
'domains': ['rentalbookingsoftware.com', 'sidev2.info']
}
});
</script>
How can we keep the clientid using gtags? I found this: https://developers.google.com/analytics/devguides/collection/analyticsjs/cross-domain but it is for analytics.js tracking, should we switch to that tracking method?