I'm trying to make sure our developer set up Google Tag Manager (GTM) DataLayers on our website correctly, as I'm having trouble validating.
Here's the situation:
I asked our developer to set up DataLayers on our website's product page using the window.dataLayer.push method. They said they did this.
I set up all the proper Variables in our GTM account to match the datalayer names collected on the website. Then I went into GTM's Preview debug mode to ensure that the Variables were populating on any product page. However, each time I checked this, the Variables came up as "undefined". Hmmm.
My developer said everything looked ok on their end and provided a screenshot of a Google Tag Assistant Chrome extension that indicated product variables were being picked up, and I saw the same thing:
GoogleTagAssistantScreenshotProductPage
I checked the source code for this product page and found this:
<script type="text/javascript">
(function e(){var e=document.createElement("script");e.type="text/javascript",e.async=true,e.src="//staticw2.yotpo.com/vznvXB90INUtUFVnU1036xQfL3T6LgDlAYStvsoA/widget.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})();
</script>
<script>
var toPushToDatalayer = ({"event":"productDetail","ecommerce":{"detail":{"products":[{"name":"Business Basics for Law Students","id":"10040","price":"80.9500","category":null,"magento_id":"36"}]}}}); dataLayer.push(toPushToDatalayer);
</script>
<script type="text/javascript">
//<![CDATA[
var Translator = new Translate([]);
//]]>
</script>
<meta name="msvalidate.01" content="DC61177F62A1EFB53CB064D74B1BB401" />
<meta name="google-site-verification" content="75YqkgTbUbVcW7fqgA9EmUo6lrULtbTDW8urj8TJMo0" />
I'm not a developer and so was concerned that not seeing the term window.dataLayer.push anywhere on the page source code might mean that this method was not used to implement DataLayers on the website. Especially since, although the variables are appearing in the Tag Assistant window, they are still coming up as "undefined" in the GTM Preview Debug window under "Variables" (although they DO appear under "Data Layer" tab), as in screenshot below for the same page:
GTMPreviewDebugScreenshot
So, I guess my question is: If my datalayer variables are populating on my product page (per TagAssistant screenshot and Data Layer tab in GTM Preview Debug screenshot (top half), why are my Variables appearing as undefined under the Variables tab in GTM Preview Debug mode (as in the GTM Preview Debug Screenshot (bottom half))?
Just to cover all my bases, here are a couple of examples of how I set up Variables in Google Tag Manager for these product page variables, in case the problem lies here:
GTMVariableSetUp
Sorry for the long post, I wanted to give all relevant info. Thanks in advance for any help!
I think your issue is with your GTM setup. To access say "name" you actually need to do...
ecommerce.detail.products[0].name
but the above will only give you the first product name since there could be numerous products.
also FYI, you don't need to create datalayer variables for out of the box enhanced ecommerce in GTM.
Related
I want to use Google Tag Manager to serve Adsense so I also can use other ads from other sources. I found few answers across the sites but not enough to understand. I would appreciate input here if it is possible to use Adsense code in GTM, if yes how? I also use DFP, if I have to use DFP then how it would be.
I assume you already have Google Tag Manager (GTM) running on your site?
Click on Variables on the left side of the screen within your GTM workspace
Create a new user defined variable and call it asClientID
Configure the variable as a Constant. The value to enter is your AdSense Client ID
Click on Tags on the left side of the screen within your GTM workspace
Create a new Tag called AS - Page view - ALL
Because there is no built-in tag in GTM for AdSense you need to use the Custom HTML tag.
Copy and Paste the HTML code shown below into GTM.
Select the trigger All Page views
Test your changes in preview mode
Once everything is working publish the changes to LIVE.
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "{{asClientID}}",
enable_page_level_ads: true
});
</script>
As you can see we are using {{asClientID}} in the script which you have created in step 1 and 2. The reason for creating this variable is flexibility. If you need to change the ID you change it within the variable and not within the code.
NOTE: that it is not best practice to implement AdSense via GTM, but it is possible.
Hopefully this is what you are looking for. Please do let me know if it works for you. :-)
I'm a consumer data analyst who is not very familiar to coding other than occasional encounters with HTML and Python, and I'm just starting with the coding part of Web Analytics. In particular, I need to learn about checking websites I don't own (therefore I don't have access to their Analytics accounts) for tracking info, but it has been phenomenally hard to find information on which tracking function each component of code stand for, or to what extent it is visible from the page source.
For a project, here is a page I'm trying to check for Google Analytics/Tag Manager/alternative analytics setup, and see what is exactly being tracked on it. Other than the source code, I checked it with Ghostery, which gave me this Tag Manager code page. Is it possible to check tracking info from these two (events, pageviews, URI and how many custom dimensions there is, specifically), and which part of the code includes that info (particularly URI and dimension info - the first two, I have more idea about)?
This is a page I'm also looking into. I can see that this one has Google Analytics/Tag manager, but again, I can't make sure of what is being tracked, and whether the Analytics/Tag Manager setup is looking -potentially- problematic in any way. Here is the Tag Manager page for this one that I obtained through Ghostery.
Any help would be much appreciated...
Looks like what you are looking for is Google Tag Assistant extension for google chrome: https://get.google.com/tagassistant/
you can download it from here: https://chrome.google.com/webstore/detail/tag-assistant-by-google/kejbdjndbnbjgmefkgdddjlbokphdefk?hl=en
When you install it it will appear as icon on any page you visit and it will show you all GA implementations on a page:
You can select tracking ID you are interested in and it will tell you how many Page Views/events were fired for that particular tracking ID only:
Then you can select individual tracking event/page view and see all data that are being sent with that tracking request. Just Click on URLs and click the icon to put the data in table:
Here "cd" stands for Custom Dimension, so here you can clearly see 2 custom dimensions that are being tracked:
Hope this helps, good luck!
I have a website that has been using GA for some time. Now someone wants me to add it to theirs GTM and replace my snippet with that GTM tag.
I don't know how to use GTM and don't really want to dig into that :/
My website was working just fine... Is there some easy way to make GTM just a simple middle man that looks at my domain and just throw everything directly to GA?
I manage to make it so GA gets info on the website traffic like active users etc. however that website has scripts that fires events to GA.
After googling a while i think this is because GTM adds some random names to the trackers and my code calls ga('send', ... ) directly :/
I know i can make a custom tag in GTM but they want it to be UA tag -_-.
Is there any way to set a default name for my trigger in GTM settings? Or some other solution?
atm. i have a code with gtm tag only and I'd rather avoid changing my web code if possible.
Edit
Ok, could someone explain to me how to achieve this:
I have this code:
var a = $('meta[property="a"]').attr('content');
var b = $('meta[property="b"]').attr('content');
ga('send','event',a,event,b);
where event is one of several possible strings of for example 'event_1','event_2' or'event_3'
and my GA has 3 goals that have action = 'event_1' etc.
How do i replace this with GTM and dataLayer?
This thread has 2 questions :
1.- Migrate a hardcode implementation of Google Universal into Tag Manager is not so simple as copy and replace the Universal Main Snipper for the GTM Code.
Look for this google guide to migrate. Has more or less the steps needed and the one to take in consideration during the migration.
https://developers.google.com/tag-manager/devguide#migration
If you goes for GTM, it's higly recomended to remove your ga() function on the page, this will stop working and you javascript too. Basically this mean, remove all your Google Analytics of the domains and install GTM and configure the corrects tags. Try to avoid things like paste the Google Analytics code inside a custom HTML tag, it's a very bad practice, but is see that a lot. Plan your migration
2.- Regarding the event you have to do :
Create a tag of universal analytics events and activate when you pushes a GTM event, them manage this values via the dataLayer
Let this link for more information:
https://support.google.com/analytics/answer/6164470?hl=en
var a = $('meta[property="a"]').attr('content');
var b = $('meta[property="b"]').attr('content');
dataLayer.push({'event': 'ga_event' , 'cat' : a , 'act' : b})
Try to involve more yourself in the GTM and Universal's World before ask, i'm not trying to be an asshole, but this question involves so many things that can be solved just looking the documentation, and somany thing to examplain in a single post.
I have been trying to get this to work for sometime and there seems to be very little information on how this works.
First, I would like to say that I tried the below method to get it working, so please read this before posting a solution.
What I tried:
I added the google analytics experiment code in a custom HTML block and had it fire only of the original page as stated by google. This doesn't work and seems to create a loop for users. A white page appears when users get to the experiment pages.
Does anyone know how to get this to work? Much appreciated
The Javascript versions of Google Content Experiments are not actually supported in GTM at the moment (they have do do either redirects or change the site on the fly and since it's hard to say in advance at which point during page load the tags fire, and it which order, this does not work very well - in the very best case the original page would load completely before the visitor is redirected to a variation).
The features page for GTM lists A/b testing tags as "coming soon" but does so since at least a year ago, so I wouldn't hold my breath.
However you can do variations serverside (you'd have to implement your own logic to display the proper variation to each users) and pass and experiment id and the variation number to GA via GTM. I do not think there is another (reliable) way to do this, at least not yet. If you need to do it with javascript you should add the experiment scripts to the page code instead of deploying them via tag managemement.
Having said that, there are descriptions for hacking around the GTM limitations using the Experiments Javascript API and some jQuery (here is one). When Google says that something is "not supported" it might just mean they didn't want to test all possible edge cases and err on the safe side. So you if you absolutely have to use GTM for Content Experiments you would have to test if something like this would work for you.
I hope that I understand your problem well. If yes, you can use Google Optimize instead of Google Experiment. The Google Optimize works with Google Tag Manager by default.
Here's what worked for me
For the pages in the Experiment, I implemented Google Analytics the "old fashioned way" with analytics.js instead of GTM.
I tested (with Realtime analytics) this and the Experiment page and the Google Tag Pages both report data.
I did post asking if there might be conflicts from ths.
It's possible to modify the Google Tag Manager (GTM) snippet to run synchronously by removing the j.async=true; line and placing it at the top of your page, immediately after the opening <head> element. Like so:
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.src=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXX');</script>
<!-- End Google Tag Manager -->
You can also retain support for users without Javascript by inserting the <iframe> part of the code in the original location specified by GTM (after your opening <body> element).
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-XXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe</noscript>
It's then possible to insert the Google Analytics Experiments code as a Custom HTML tag in GTM. Just make sure you check the 'support document.write()' checkbox.
Just don't forget to update GTM-XXXX with your container ID.
I noticed that Google has released their Tag Manager application making it really easy to make changes to your tags and tracking options. How can I use this tool to track off site links?
Google Tag Manager (GTM) is not a tracking tool, so the short and unhelpful answer is that you can't. However you can deploy Google Analytics via GTM, which I guess is what you mean. I have to say, though, that tracking offsite links turned out a little less straightforward than I expected it to be.
Usually you track external links by virtual pageviews (or events). The usual way in GTM would be to push a variable to the data layer on the click event of the link and then fire a GA tag with a virtual pageview based on a rule based on that event. This failed completely for me when I tested it, presumably because the new page had loaded before the GA tag could fire. So I resorted to a not very elegant workaround:
First I created a standard Google Analytics Tag (tracking type pageview) to make sure the GA code was included in the site. Then I created a custom HMTL Tag with a bit of Javascript (this is assuming you use jQuery in your page):
<script>
$('a').click(function() {
var p = $(this).attr('href');
if (p.search(/.+YOUDOMAIN/) == -1){
_gaq.push(['_trackPageview', "external://" + p]); // mark links as external in the GA interface
}
});
</script>
For all links that do not contain YOURDOMAIN a click event with a pageview is attached to the link. To make sure the all the links are tagged with the click event you set a rule in the tag manager to make sure the script is executed only after the page has loaded you set event based rule in the tag manager where the event is equal to gtm.load (gtm's equivalent of jQuerys domReady).
This works (at least it did in my tests), but since it does not use GTMs intermediary dataLayer it looks rather like a hack to me. If anybody can suggest a proper solution I'd be grateful.