In this video, I’ll show you how to check your Google Analytics tracking codes without needing to wait for the data to show up in Google Analytics.
Hey everybody, this is Chris and I’m a developer here at Seer Interactive. Today, I’m going to show you how to use the Google Analytics debugging tool to make sure your GA changes and code changes work without needing to wait 24 hours for the data to show up. We’ll be using the Google Analytics Debugging Tool. So let’s just get started!
On the left hand side of the screen here, I have the webpage in question and on the right hand side near the top, I have the HTML code for the webpage and at the bottom, I have my Apache log. So, when I go to the page and refresh it, I can see some stuff happening. We’ll see the HTML run, grab a picture, and try to grab the favorite icon. But we don’t have one, so it’s not there. No big deal.
Let’s take a quick look at the HTML first down here, somewhere on line 121. This is our Google Analytics code. It’s the top half of it that sets up the account and starts to track our page views. The second half is actually at the bottom. You’re allowed to split it. That’s OK.
This is our form. Somebody fills in the form, hits the submit button, and it sends them off to a PDF file. What we want to do is track when somebody hits that submit button and gets a PDF. That’s what we want to track.
So, to do that, you’ll need to get the Google Analytics debugging tool. To get that, just type in “google analytics debugger chrome” into Google. (Or just follow this link) And I think it’s the first link. Yup. There it is. Go ahead and install that plugin and what we need to have it turned on so I’m just going to right click on it and turn it on. (Correction: left click!) My plugin is already turned on so I’m ready to go.
Now that I’m ready to go, I’m just going to hit refresh one more time. Alright. Great. And I’m going to right click on any part of the page and click on inspect element. The first thing it’s going to do is send me to the elements page. We want to click over to the consoles page.
You can see that this consoles page shows us everything that’s happening with Google Analytics. So here’s our tracking code, and there it is, our tracking code as reported by Google Analytics. _trackPageView, and there it is again it’s tracking our page view. The rest of this stuff is just information parsed out from this giant URL. The hit ID, the referring URL, page, time, session time, local time, what my browser is, you know. Things of that sort.
What we’re going to be doing is filling in the form and what we want to see is our virtual page view show up at the bottom of this list as soon as we hit that submit button. So again, we’re looking for our tracking page view, this URL, and looking for it way down here at the bottom. So let’s go try it out!
Type into the form. Test, test, test, and my email address which is very much not a real email address, but that’s OK, and hit submit. It should show up here. Now, this is going to show up pretty quick because this is going to refresh and immediately go to a PDF which means all this stuff on the screen is going to go away. But I’m going to rewind the tape (video, actually) so we can actually see it and I’ll show you how it works.
So we hit submit now. Boom! There you go! Did y ou see it? You might have missed it. That’s OK. You’ll notice that before we hit submit, it did actually go to the form, register through the 3rd party data collection stuff for the form, and gave us back the PDF. So we know that the form itself worked and I’m pretty sure that our tracking worked too. But I’m going to rewind the tape (aka, the video) to check to make sure that works.
So this is ScreenFlow. This is the program I used to record this video but what I’m really interested in seeing is slowing down the time and watch the processing that’s happening.
So I’m right here, right at the point where we are about to hit the submit button. I’m going to scroll this over a little bit until maybe about… Hit submit now? There it is! I hit submit and we can see our tracked page view and our URL registered with Google. It actually sent the tracking beacon.
You’ll notice it hasn’t actually refreshed the page just yet. If I scroll a little bit further… there it is. It just refreshed the page, it grabbed the PDF, all of our information (on the screen) is gone and you’ll see the browser … just about here … there it goes… renders the PDF.
And that’s it! So now we definitely know this works so we can probably push this out to the real website and I’m pretty sure it’s going to work now.
So that’s it. Hopefully, it will help you guys out without having to wait 24 hours. Talk to you later!