Enhanced eCommerce tracking demo shop: enhancedecommerce.appspot.com
DataLayer Documentation: https://developers.google.com/tag-manager/enhanced-ecommerce#promo
Container Download: https://measureschool.com/wp-content/uploads/2018/12/EECPromo.json
In this video, I’m going to show you how you can track internal promotions like banners on your homepage with the help of Google Analytics Enhanced eCommerce tracking and Google Tag Manager. All and more coming up right after this.
Now, what are promotions in the sense of the enhanced eCommerce tracking? Promotions are, for example, banners on your homepage, where you actually want to bring the user deeper into the website or making them aware of a certain promotion that is going on right now. So for example, you could have a banner on the homepage saying we have 20% off on our shoes right now. So if the user clicks on this, then he goes to the category and he buys later the product may be. Now, you want to track how many people actually viewed this promotion, and then clicked on it and ultimately bought right. With the enhanced eCommerce tracking, promotion tracking, you can do all of this.
Welcome to the Enhanced eCommerce tracking demo shop. This is something you can access yourself at enhancedecommerce.appspot.com and this shop was built by Google to show off how you need to implement the enhanced eCommerce tracking to get full functionality of it. In order to see what needs to be implemented into the dataLayer, you can always click on this information icon here. And you see if the user clicks on this product, we need to deploy this kind of dataLayer. But today we want to concentrate on a particular dataLayer and this is the promo dataLayer. Right here we have a promotion going on. And when we click on it, we go to a product and then we can buy the product. Now, in the enhanced eCommerce tracking specification, you can in particular track when the user sees this promotion impression, and then also clicks on it. And the data layer that you need to implement for click is this dataLayer right here. And for the view, we actually have them on that page view when the page loads. Now we have product impressions here. But also down below here we have the promo view. So these are two dataLayers that would need to be sent over for the impression or promo data to work.
Once that data available and sent over to Google Analytics, what would it look like? If we go over to analytics, we can go under the conversions then under eCommerce and marketing then internal promotions. This is where the data would show up. If we have enhanced eCommerce tracking installed, you could see the name of the promotion then how many times it was seen, how many times it was clicked. And from there, it calculates the CTR. And if the user has bought a particular product, later on, we would be able to also see the transactions that are connected to this internal promotion click. So really interesting data. By the way, you can also use this for non-eCommerce tracking websites. It is just what Google Analytics calls and enhanced eCommerce tracking feature. And if you are flexible and can ignore the eCommerce label, you can also track, for example, internal promotions for a lead generation website or certain elements on the homepage that you want to classify as promotions.
Now you can put in a different creative if you have different creatives for flying ninja and a position. These, by the way, are pushed into dimensions that you can also access by the secondary dimension. So if you put in creative here we have internal promotion creative, this would be the creatives and we also have the position.
So I’m going to set this to true for now. Later, if you actually publish this, I would go back and set us to false because you don’t want to have that data always in your debug console. All right, and then we just need to choose a trigger, which trigger do we choose? We have an old pages trigger that would obviously mean that the ad would be triggered, or the promo view would be triggered on all the pages. We only want it to be seen on our particular page here. How can we target this page or every time the app is seen? This is actually pretty far down. So at the beginning, the user can actually see it. So I don’t want to send an impression over once the user lands actually on a page only if you scroll down and sees this ad. And this is something you can use the element visibility trigger for. So let’s go ahead and build one. I’ll go here to the plus and as a type, we choose element visibility. And now we can select a method to actually trigger this either an ID or CSS selector. Obviously, you would need to know a little bit of CSS and figure out what the right selector is. I’m going to go here and right click and go to inspect element. And this will give me the HTML markup. And luckily, for us, we have here our section, our section of the ad. And it has an ID, media image two. So I’m just going to double-click on that and copy it and fill that into the ID. In most cases, you will probably need to use a CSS selector, which gets more complicated as you try to filter down on the elements that actually should be viewed here. So I’m going to go with the ID though. And I can choose whether they should fire every time the element is seen. This would be this one once per element. So if you have multiple elements only once it will fire or once per page. I will choose once per page for our example here. And how much should be seen of that element? 50% is fine with me. Now, I don’t need to worry really choose any filters here as this will only fire if the media image two is actually seen. Now, let’s just give this a name. This is the visibility trigger for our ad. Let’s save and save this again here. And now let’s try to this all out, refresh our page.
Well, it’s already fired here because it just down there. Let’s reload again. Somehow remembers where I was at a time. Now let’s go to another category here.
Let’s go to the t-shirts and see if this works. Okay, now we are on the t-shirts page and we just gonna scroll down. And we see element visibility now fired. And our ee promo view has fired as well. Now, this information is sent over to Google Analytics. How can we make sure that it was actually sent? That’s where this debug view came in that we have activated in our tag. We can open up the developer tools again, right-click Inspect Element and here under the console, we should now have information available of what data was actually sent over to Google Analytics. First of all, we had our pageview. This is something that fires normally on the page as we have a pageview trigger installed. And then afterward, we should see an event and this event should have our enhanced eCommerce tracking data in here as well. So here’s our event. And we also sent over an EC add promo. And this is our ID, our name and so on. So this was sent over to Google Analytics correctly. We can look this up in the account on the real-time reports here on the events. You see events last 30 minutes, we have our enhanced eCommerce tracking promo view that was sent over. Now, this only tells us that the event was received by Google Analytics. But did it actually pick up the right information from our enhanced eCommerce tracking dataLayer or the eCommerce object that we send over? Let’s go over to our conversions and under eCommerce, marketing internal promotions, we need to set the right date. Just going to pick the last date and here we see some information already been received. So we have here our internal promotion and our promotion views and the clicks or something that test it out beforehand, which we’re going to get to in a second. All right, so this is how you can already send over information about the promo view. In the next video, we’re gonna take a look at how we can send over our click data to Google Analytics as well.