Author: Ateeq Ahmad

Analytics, Google Analytics, Google Tag Manager

A Simple Guide for implementing Google Analytics Transaction Tag

Ateeq Ahmad

There are lots of theoretical posts showing pretty pictures of e-commerce reports and also telling you how to implement enhanced e-commerce via Shopify or WooCommerce. However, when I set out to learn how to implement e-commerce in Google Tag Manager (GTM) using the transaction tag, there was no simple step-by step-instruction that was free for the beginner. This post is an effort to simplify the implementation of the transaction tag.

Step 1: Enable eCommerce settings in your Google Analytics account. 

Go to Admin> [View that you are working with]>Ecommerce Setting and set the “Enable eCommerce” toggle to “ON” as shown in the picture below.

Step 2: Set up a purchase trigger in GTM

Now, you need something that will trigger the transaction tag to fire(we will build that in a minute). Ideally, you have an order confirmation or “thank you” page after someone submits their order. You can use that as a trigger as seen below

Sometimes, you don’t have a true “next page” when a customer buys from you. In such cases, it is recommended that we use a custom dataLayer event (Step 5 will make this crystal clear. Hold your horses please!). Set up the purchase trigger, exactly as pictured below:

Step 3: Set up the transaction pixel in GTM

Now let’s set up the Transaction tag that will collect data based on the triggers being fired in Step 2. Please see the picture below:

Step 4: Push the GTM container live

Everyone forgets this step in the excitement of setting up eCommerce to work perfectly so I made sure to remind you of doing that as a separate step.

Step 5: Send the dataLayer code to the developer

At this point, we have a trigger to fire on a custom event and a transaction tag that is supposed to pick up transactionID, revenue and products sold. This step is the key to get all the data collected via GTM and pushed through to Google Analytics. The code below will need to be present on the DOM(document object model) the moment a customer clicks on the “Buy” button(or whatever is the last step in your order process).

<script>

window.dataLayer = window.dataLayer || [];

dataLayer.push({

‘event’: ‘purchase’,

  ‘transactionId’: ‘1234’,

 ‘transactionAffiliation’: ‘Acme Clothing’,

  ‘transactionTotal’: 38.26,

  ‘transactionTax’: 1.29,

  ‘transactionShipping’: 5,

  ‘transactionProducts’: [{

   ‘sku’: ‘DD44’,

   ‘name’: ‘T-Shirt’,

    ‘category’: ‘Apparel’,

    ‘price’: 11.99, 

   ‘quantity’: 1

 },{

   ‘sku’: ‘AA1243544’,

   ‘name’: ‘Socks’,

   ‘category’: ‘Apparel’,

   ‘price’: 9.99,

   ‘quantity’: 2

 }]

});

</script>

Addendum: Some points to keep in mind.

The formatting above leaves a bit to be desired. For a properly formatted “Thankyou” page, please go to the following sample page and right-click to view the HTML source.

Please note that this code needs to be fired above the GTM code on the thank you page for the dataLayer to be populated before the GTM container fires. This is key to capture the data and cannot be stressed enough.

You will see that there is an event being fired that is called ‘purchase’. You will recall that we built a trigger in step 2 specifically to fire when this custom event fires. So now you can understand why we did that.

Make sure that the developer understands that the names of the variables within this dataLayer need to be EXACTLY as laid out in the example script above. TransactionId cannot be named anything else like transactionID or myOrderId or aPoxOnYouMarketing. No cuteness is allowed here.

Also, make sure to study the guidelines by Google on the types of these variables. For example, transactionTotal has to be a number and can’t have quotes around it. You will note that some variables are required, and some are not. All the values for these variables must come from the order itself. Please do not just copy and paste it into the codebase.

Speaking of quotes, please do not just copy the code from this blog post because the single quotes in the dataLayer above do not copy well. Please make sure to send them as plain text to the developer and point out that they are single quotes, just to make sure.

All the values for these variables must come from the order itself. Please do not just copy and paste it into the codebase.

You are done! Please understand that the code set up here is the bare minimum that the developer will need to implement for you to see product revenue, transactions and total revenue per order. If you want to implement enhanced e-commerce, I recommend the following links for you to read and digest. 

AnalyticsMania: How to Set up eCommerce Tracking in Google Tag Manager.

Simo Ahava: Enhanced Ecommerce Guide For Google Tag Manager.

Always remember that you are not alone in this walk along the dark caverns of e-commerce tracking. There are many lights that shine if you were but to look for them. Please let me know if something is not clear. I am always available to answer questions and to help if you get stuck somewhere.

Freelancing

Five steps to making remote work productive and peaceful.

Ateeq Ahmad

I have had to work from home for the last three years. It was torture at first because I really wanted to get a “real job” and go somewhere and be part of an organization. This working online (I am a big Upwork-ophile now) was only a bit part before I could get back to work properly. I quickly realized that this was going to be my “real job” from now. This brought on adjustments to life and work that have been a real boon for me. I want to share my learning with you so this short period of coronavirus-imposed remote working time will pass more pleasantly.

First, create a calendar with four to five working hours. It really helped me to create time boxes in my calendar to tackle the different tasks I wanted to do. An empty calendar is the most frightening thing that a freelancer can encounter. It takes time to get the discipline to follow the calendar so please don’t get frustrated in the first few days. 

Some days, you will drift along like flotsam in an ocean of mundane tasks not related to your immediate work. You can end up feeling very guilty if this happens and you are working from home. It happens in the office too but somehow, we convince ourselves that the place of work justifies whatever we do there. 

Don’t feel guilty all the time. Relax! Follow the calendar as a guide, not a legal judgment.

Second, take a break every working hour. I get up every hour and walk around, read my emails or watch a video. There are many distractions at home, and you should give in to them a little bit otherwise you risk not being able to get that hour of work. 

People always advise us not to check email in real-time and set times for when to check it. A sound idea but don’t make it a fetish. Some days, you do have to monitor your email. I need to be very responsive to my clients when there is a fire happening, so I check email more frequently some days. 

Third, find the flow times and work those hours. All of us are more productive during certain hours of the day and can get a whole lot done then. Find those times for yourself. If you pay attention for a week, you will recognize those times. Think a bit and if you don’t remember looking at a clock at a certain time yesterday, that’s the flow time for you. 

Remember time is not just an interval between hours, it is also your experience of the duration. Focus on the experience. Somedays, my flow times are very small. It’s normal. Somedays, I can be in the flow for hours on end. That is normal too. On average, if you can find 4-5 hours of flow, you are killing it. Talk to someone who writes for a living. They are intimately aware of these rhythms.

Fourth, socialize with colleagues every day with an hour of meetings/chats. Extroverts will need it a lot. I find myself hanging on to phone calls with clients and later realizing that I desperately wanted to have a professional conversation. We are a social species and the isolation that is proposed to deal with this coronavirus is not normal. We have great tools to communicate now so get on Slack, Twitter, Skype and talk to your pals. Get some gossip in too! I know you miss that about work.  

Introverts need a bit of it too. They are probably more comfortable isolating themselves but sometimes they need the vibe of an office or the buzz of events happening around them. I would advise them to write to their colleagues more and use the chats that organizations provide to get some social time in. Get a book club/coding club together so you can create a context to chat about. I don’t think introverts are above gossip too. Indulge in it! Secretly, bosses love being talked about behind their backs. It’s true!

Finally, have a planned stop time every day. Of all the other points that I have talked about, this is the hardest to adhere to. I take on more tasks than I can handle every single day. I have become better at prioritizing but there are still days when a pile of stuff “can” be done before midnight. Desist!

Make sure the high priority work gets done and leave the rest for tomorrow. Working remotely, we want to do more just to prove that we are not wasting time at home. No matter how much you do, there are going to be people who think you are. Ignore them and keep your head around what you had planned to do. If you are done with that and even a few more things that were easier than you thought, then quit for the day.

I admit, there will be some days where deadlines are squished, and you must push. If they are not more than 10-20% of your workdays, you are doing well. 

There is an important caveat in all my advice.  Most of my learnings came about because I was forced to take a break. I had just gone through a blood cancer treatment. It went very well, and I just passed my 5-year period two days ago. However, it destroyed my body and I need to build up again. The healthy among you might be able to work more and with much more ease. So, put in a little more time but please don’t schedule ridiculous hours in a day. If you are at work for 8-10 hours, including meetings, you get maybe 5-6 productive hours a day. Why should remote work be any different?

My rough usual schedule during the day – It is flexible

  • Wake up for prayers at 5:45 am. 
  • Work for an hour and focus on thinking tasks. This post was conceived and written at this time.
  • Breakfast and exercise – I take two hours for this
  • Work for two hours – this is my flow time and I get a lot done. Any interruptions in this part of the day really slow me down.
  • Lunch and rest – At least one hour for this. Take your time. Let work pile up. It can wait.
  • Work for an hour – This is really the last flow hour of my day and my mind is really flying. I feel like a supercomputer. Any coding or logic work here.
  • An errand break or chatting with the returning school kids.
  • The last hour and wind up – What work is left over? If there is a lot, can it wait? Most clients of mine can wait another day. Schedule the next day’s calendar and send status emails to clients/colleagues/bosses.
  • It is done! Whenever I give in to temptation and work more, I make mistakes! Really silly ones! 

This is the go-home-time. So what if you are working from home? Start commuting from the workstation to the couch. Walk slowly if you really want to simulate it.

I hope this little write-up helps. It is hard to do and if you fail a couple of days, please don’t feel guilty. This is really hard work. It takes discipline and that takes practice. If you are a manager of teams, please send this to them. They have been conditioned to be supervised and will be conflicted about how to be by themselves.

Analytics, BigCommerce, Google Analytics, Google Tag Manager

Integrate BigCommerce and Google Analytics

Ateeq Ahmad

One of the most common platforms in use today is BigCommerce and it allows seamless integration with Google Analytics. However, their own documentation and other tutorials don’t explain it very well. This post attempts to do so simply and with lots of pictures. We will also implement a couple of events in Google Tag Manager that will allow us to track the behavior of our visitors on the BigCommerce Checkout page.

I feel it is best to proceed in steps as this is a prescriptive post. So here it is.

Step 1: Google Tag Manager Set up

We do need to set up Google Tag Manager(GTM) for our website (it will become apparent why in Step 5). There are a million guides on how to do that so I will not add any value writing my own implementation. Let’s assume you have seen this video….

Note: I profess adoration for Benjamin and the simple and comprehensive manner in which he explains some very tricky concepts. Please subscribe to his channel and learn.

…and implemented the Google Analytics pageview tag from within GTM.

Step 2: BigCommerce Google Analytics set up

  1. Login to your account in BigCommerce.
  2. Click on Advanced Setting on the left-hand tab as shown below
  • Then click on Web Analytics on the sub-menu of Advanced Settings.
  • You will see the following screen with some selections to make.
  • Please select Google Analytics and click the save button in the bottom right corner.
  • You will be taken to this screen. Click the Google Analytics tab marked in Green.
  • You are now presented with two options
  1. One, just add the Google Analytics code here. It looks like this

<!– Global site tag (gtag.js) – Google Analytics –>

<script async src=”https://www.googletagmanager.com/gtag/js?id=UA-2124872-7″></script&gt;

<script>

  window.dataLayer = window.dataLayer || [];

  function gtag(){dataLayer.push(arguments);}

  gtag(‘js’, new Date());

  gtag(‘config’, ‘UA-XXXXXXX-X’);

</script>

And you can get the UA ID from your Google Analytics > Admin > Property > Tracking Code

  • Two, you can enable enhanced ecommerce tracking with just a click. I highly recommend you choose this second option because it gives you a lot more data with no real downsides.
  • Click save and you are done with the implementation in BigCommerce.

Step 3: Enable eCommerce in Google Analytics

Enable eCommerce settings in Google Analytics by going to Admin > View Settings > Ecommerce Settings and configuring the set up exactly as below:

You can name your funnel steps differently but there are only two of them in the BigCommerce checkout process.

Step 4: Check the events using Data Layer inspector

If you have not downloaded the Data Layer Inspector extension by Adswerve, please do so before proceeding forward.

Now go to your website and add a product to the cart. If you are on a PC, press CTRL+SHIFT+I to see the developer tools. You can also get there by following the path shown in this picture below.

Once you are there, click on the Console tab. It is to be found between Elements and Sources. You will notice that a page view(with your tracking domain) and an add-to-cart event have both been fired as seen in the picture below.

Once you go to the checkout page, you will see more enhanced eCommerce events firing, as shown in the picture below.

All these events will feed into the Google Analytics conversion reporting section and will help you see where customers are dropping off.  

Step 5: Add the button events on the Checkout page

The one thing that you are not able to determine is how people behaved at the checkout step. There are no events automatically set up to capture the “Continue as Guest” button and the “Continue” button after the shipping and billing information is submitted.

To set these up, we will use Google Tag Manager(GTM). We will set two events.

  1. Continue as Guest Button: Add a trigger to fire when the click text value is “CONTINUE AS GUEST” and the page path is “/checkout” exactly as the picture below.

Now, create a tag to record an event when the above trigger fires. You can configure it exactly as the picture below

  • Continue after Shipping Address: Add a trigger to fire when the click text value is “checkout-shipping-continue” and the page path contains “/checkout”. You can copy the picture below.

Now, create a tag to record an event when the trigger is fired. You can configure it exactly like the picture below.

These events will give you a sense of how people behave at the checkout step. There are a few other events you can capture on the checkout page. For example, the type of payment chosen(Paypal, Google Pay, etc.)

Step 6: You are all set! High fives all around!

Just make sure that you have configured all the above steps correctly. If you have any questions or encounter problems, please write to me and I will help you get set up properly.

Analytics, Business Intelligence

Some Sample Dashboards in Google Data Studio

Ateeq Ahmad

Here is a collection of dashboards that I generally promote to clients because they can be immediately put into operation. All you have to do is replace the sample data set with your own personal data. These are copyright free. Just understand them well before using them.

Sample of Adwords Dashboard

As you can see, this is a simple dashboard that gives you the performance of your campaigns at a quick glance. You can see a demo or download it from here.

Comprehensive e-Commerce Sample Dashboard

This is a huge dashboard bordering on a comprehensive report that e-commerce companies will usually want to see right away. It includes 5 sheets and can get you off the mark right away. You can download it right here.

Content Performance Sample Dashboard

If you are working for a content site that really needs to know how each landing page performs, I have used the above dashboard to start the conversation with a client many a time. This dashboard has several filters that allow you to segment the traffic and judge performance accordingly. You can copy this report from this link.

There are a lot more dashboards and reports that other people have shared with me so if you need something more specific, drop me a line here and I will get it for you.

Analytics

Adding Google Analytics and Google Ads Conversion tags to Cvent landing pages

Ateeq Ahmad

Step 1

Cvent has provided a guide to add Google Analytics integration to its landing pages. Please pick up the guide here and follow the steps 1 to 3 on page 9. Please enable the linker plugin there too. See picture below:

image.png

Step 2

Now, that Google Tracking is in place, add the conversion tracking code for Google Ads.

Please add the two code snippets posted below to the “Admin>Account>Account>Code Snippets>”. Please follow this video for the details.


The re-marketing pixel for each Cvent form:

—————————————————————————————————————

<!– Global site tag (gtag.js) – Google Ads: 1002231020 –><script async src=”https://www.googletagmanager.com/gtag/js?id=AW-1002231020“></script><script>  window.dataLayer = window.dataLayer || [];  function gtag(){dataLayer.push(arguments);}  gtag(‘js’, new Date());
  gtag(‘config’, ‘AW-1002231020’);

</script>

—————————————————————————————————————  

The conversion pixel for each time a lead is submitted via Cvent:

<!– Event snippet for Cvent Form Conversion conversion page –> <script>  gtag(‘event’, ‘conversion’, {‘send_to’: ‘AW-1002231020/bYQ2CJDy25oBEOyp890D’});</script>

Step 3

  
Once done, and the code is assigned to the right places, as per the video link above, please enable cross-domain tracking from within Google Analytics. Excellent video provided by Benjamin at LovesData.com


Step 4

One more thing left to do is to add cvent.com to the Referral Domain Exclusion list in Google Analytics. To do that, please go to the Property( the middle portion of the Analytics account) as shown below

Please click on the yellow “Referral Exclusion List” and enter this text into the referral exclusion list.

That’s it! You are done and will be able to track Google Ads conversions as well as page views on the Cvent landing pages to your heart’s content.

The same process can be followed for Facebook and other traffic sources by just replacing the code in Step 2 with the equivalent for tracking the other traffic sources.

I do realize that this is a bit confusing so I can get on a call with the developer putting this in place if needed. To contact me, get me on Upwork or just write to me here.