Add to your Analytics Tag
Make sure you have any relevant built-in variables (click id, click class) and triggers (all elements/link clinks) enabled in your GTM.
Now that we have our conversion, let’s navigate to custom dimensions. Let’s create both a User based custom dimension for our cta_button_audience which is handling our cookie value.
Now all we have to do is do an audience comparison with our conversions and we are swimming in A/B test sauce.
Now we can filter by both our key action that we want to see and also the different variations. This gives us ultimate clarity (pun intended) into how the different pages are performing with our variations! Give it a few days and you’ll get your changes in two different heatmaps!
You can build an audience report by creating a custom report in the library and using the audience as a dimension.
For this part of the lesson, we will assume you have Microsoft Clarity up and running. I like Microsoft Clarity a lot. It’s free and has a TON of features that are really valuable. For this particular task, we are going to be using the custom tag filter feature.
We now want to use our random number to set a cookie value based on whether a user is assigned to the control group or the test group. You could also create multiple variations by adjusting this logic with the amount of numbers that represent a version. In this version we are looking for 0-49 & 50-99 to set different variations, but you could easily adjust to 0-33, 34-66, 67-99 for an A/B/C test (etc.)
- Create a new RegEx Table variable
- Set the Input Variable to the random number variable you’ve just created
- Use this RegEx to target the split-test numbers:
- Control Group: 0 – 49
- RegEx Pattern: ([0-9]|[1-4][0-9])
- Test Group: 50-99
- RegEx Pattern: ([5-9][0-9])
- The Output values will be based on the type of test you are running. For this example, we’ll be doing a simple CTA button text change.
Update Cookie Tag with RegEx Table Variable
To run statistical significance tracking you can use any A/B test calculator but my preferred is CXL’s AB Test Calculator. Just dump your data in and it will calculate the lift for you!
You will likely want to test at this point. Testing is pretty simple. Just go to your preview mode, and open the page you want to test on. You’ll get your randomly generated value and it will set a cookie since it’s your first time there. You can then navigate to the Chrome debugger and edit the cookie value between your control and variant by finding the cookie value in Applications and looking for our _gtm_exp cookie.
You can go one step further by also building custom events for your CTA clicks & conversions, which will make finding specific recordings much easier.
First, just like with CRO tools, we need to make sure our cookies load before information gets sent to our analytics tools. So if you are firing your marketing analytics tool on Pageview as well, we’re going to need to add an analytics event that fires when the cookie is set.
Now don’t get me wrong, you should absolutely invest in an A/B testing platform. They have a butt-ton—(can I say butt-ton?…no? Ok how about boatload)—a boatload of features that go beyond what I am about to show you. Also, A/B testing in general should have a dedicated process, with a well-thought-out testing matrix, strategists, developers, designers and analysts. If you’re going to have all of that, you should probably have a dedicated tool,right? If you just want to be a little whimsical about it though, I will show you how to do testing without anything fancy. Just a little grease on your Google Tag Manager wheels and any analytics platform.
Another Note: you can actually set the variable to an event level parameter instead of a user-based one since we will be building it as an audience who saw the particular event anyway, but I think User Properties are a bit cleaner. If you are running low on User-level custom dimensions, event custom dimensions are fine.
Build Your Conversions
To do this we want to go back into our cookie creator tag and set the Cookie Value to our RegEx table.
First lets build a Cookie in GTM by importing the template “Cookie Creator” from the Community Gallery. Review the permissions (which allow cookies to be written if you specify them in the template) of this Tag Template and select “Add to Workspace.”
In GA4, there are a few steps we need to take to get this to work. First, we need to set up our conversions. Some may already be set up, but the one we just built above we need to set as a conversion. You can either wait for the event to show up in GA4 and then check the little blue toggle next to the event, or we can navigate to conversions and input the name of the event manually. Let’s do that one.
Set Up Your Custom Dimension in your Marketing Analytics Tool
Now that we have our RegEx table, we can use it to build the functionality of our split test. We’ll be using the 0-49 randomized number to set the control & 50-99 to set the variant.
- Name your variable “Random Number (0-99)”
Create a RegEx table Variable for the Cookie
For the trigger we want it to fire on all pageview events where the cookie does not yet have a value that includes our test.
You may want to set additional cookie options- like SameSite if you have subdomains, etc. -but we’re going to leave it blank for now. Feel free to use this FireFox page as a resource for all the different configurations you can do with cookies.
Now that we have the cookie in place, we can build our actual test.
Create a Custom HTML Tag with Your Changes
If you already have a conversion that you want to use with this setup you can skip this section. Otherwise, if you want to set up a secondary conversion or you have no conversion you can follow along with the below to set up one.
Step 1: Create a new Custom HTML tag. This will contain any necessary scripts to modify website content for your Test Group.
The death of Google Optimize is upon us. And wowee, aren’t you a little bit heartbroken. Gone are the days where you’ll be able to switch a button on your website from red to green and run a mindless A/B test. Now you have to pay $60,000 annually for that. But wait! What if I told you that you can continue to run A/B testing FOR FREE, leveraging tools that are probably already on your website. Would you pay me $60,000? How about $2? I’ll take it…
Awesome. One last thing. We also want to add to our main configuration tag. This ensures that as people come back to the website and the variant is there, it also communicates the value to the user-level custom dimension. It should remain with that user but this is a secondary level of protection from GA clear cache etc. It becomes a little more secure than just relying on the event itself as the event only fires the initial time that the user gets bucketed. The cookie will remain as a value as long as it’s stored in the person’s browser. After the initial placement, the cookie should be there on page load so you can capture it with your main configuration on pageview.
Great job! You made it and can stop here. Or we can bring both variations into Microsoft Clarity. You want to continue??? I APPLAUD your tenacity.
Integrate with Heatmap
In the Tags tab, create a new tag using the Cookie Creator tag template you’ve just saved.
- Set Cookie Name to “_gtm_exp”
- Set Cookie Value to “abc”
- We’ll be updating this value later to dynamically populate based on random allocation. Since we can’t save the tag with a blank value, let’s add “abc” to the cookie value for now.
- Set Expiration Mode to “By month”
- Set Expiration by Months to “6m”
- “Even if your experiment duration is shorter than 6 months, having a longer expiration date ensures that users will continue to see the same experiment on return visits until this cookie is removed”
How to A/B Test for Free with Google Tag Manager, and any marketing analytics tool.