Erik Wagner, Program Manager at Volacci, walks you through the steps of installing Google Tag Manager and Universal Analytics on your Drupal website.

Transcript:Hey folks, this is Erik Wagner from Volacci, and today I’m going to be walking you through installing Google Tag Manager and Universal Analytics onto your Drupal website.

So to get started, I have actually loaded up Google Tag Manager. For those of you who don’t use Google tag manager yet, just go to https://www.google.com/tagmanager/. Once you’re here you are going to need to create a new account. I’m going to walk you through the steps here and just talk briefly about the concepts.

First, we need to create an account name. So, generally that’s going to be potentially your company or your brand name depending on the structure. I’m just going to name this Erik Wagner’s Website, okay. Then, you want to have a Container Name, and I’m going to call this Drupal Garden’s Website, because I actually have this installed or I'm going to install this on my Drupal Garden’s website here. I will capture my URL here and just copy and paste action, back in here paste that in, and change to HTTP. I’m going to set the time zone to Central. Quick review and everything looks good. Let’s create container. Excellent. So, now I have the code for our container. The container essentially will hold all of the tags. The container needs to be installed directly after the opening body tag on every single page of the website. So to do this, we’re gonna copy and paste this code, we're going to switch over to our Drupal Gardens website here. I am going to click on ‘Structure’ and theoretically it will load. Alright, we're going to click on ‘blocks’, we are going to create a new block, I'm going to ‘Add block’ and I am going to give this a description to call this Google Tag Manager Container. Now the code they gave us is HTML so I’m going to switch from WYSWYG into HTML here and paste that right in. I'm also going to make sure that this is selected on Full HTML, instead of Safe HTML. Although it may work with Safe HTML, I’m going to switch it up. And did that work? It did, okay.

Now I need to choose the location, now remember we want to have it right after that opening body tag. So I'm going to put it up as far as possible, the Preheader first, pretty early on. I'm going to have this on every single page. Now press 'Save'. Alright, your block is created. Now let's go double check to make sure everything worked out fine. Now I'm going to close that and go back to the home page here. Excellent, now code to be found, let's take a look at the page source here. Ah, here's our code, excellent, looks good. Cool, so our code looks good.

Back to Google Tag Manager, we need to get our Google Analytics code installed. We want to create a tag here. Alright, now that this has loaded the next step for us is actually to capture and create a new view within Google Analytics. So I'm going to switch tabs here. First step is we are actually going to create a new property, click on 'create new property.' We want to create a Universal Analytics property and call this Erik's Drupal Gardens Website. I am just going to drop my URL in here. We're going to come with an Industry category here and call this 'Computers and Electronics' and I'll go with Central time, which is where I am located. Press 'Get Tracking ID'. I am now brought to this page here, which has my tracking ID, which is what we're going to need next. I'm going to copy that tracking ID and then go over to Google Tag Manager again. I'm going to call this Universal Analytics, because we're going to install universal analytics, not this Google Analytics nonsense, though.

Paste this tracking ID in there. You'll notice we have the ability to choose a different Track Type, so it could be Page View event, Transaction, yadda yadda yadda. I'm choosing Page View. I'm not going to get into more settings or advanced settings, for the sake of time here press save. We have now created our first tag in our container.

However, before I get too far ahead of myself, I just realized I forgot something here. Let's go back into our tag here. You'll notice that it says here on the right hand side 'this tag will not be fired because it has no firing rules.' Alright, let's click this firing rules. Actually, there has already a default rule here. This tag will fire on every single page and that's what we want to do here. So, I will just click that 'All pages' and I'll press Save. And then I will save that here. Alright now let's go and let's create a new version here. Okay, so we created version number three. I am actually going to name this something a little bit more interesting and more descriptive as well “Universal Analytics Installed and Firing Rules Setup” and press 'save'. Let me press 'Publish.' And now our container tag and new tag has been pushed to the website.

Now that that is done, let's switch over to Google Analytics here, and we should be able to see, although I probably need to load. Alright now the website has loaded, I'm just going to click to a separate page here so we can see some browsing activity. Let's go back, let's take a look. Ah, look at that, one active visitor on the website. They're on the about us page. Looks like our Google Analytics installation is up and running.

Well, that's it folks! If you have any questions or is there anything else I can do to help, please let me know. My email address is erik.wagner@volacci.com. Thanks!

A walk-through of the steps necessary to install these useful tools.google tag manager, universal analytics, Planet Drupal