It’s always great to know end to end metrics for any of your sales funnels.
Whether the sale is in your control or not, you still want to measure as far down the sales funnel as possible until the sale is out of your hands.
A good example of this is if you use a delivery platform like DoorDash or Ubereats. Usually a 3rd party platform like those handle the sales process for you while you just send traffic to them from your website.
Today I am going to show you how you can track how many people clicked on buttons that happen to be the furthest you can track a specific sales channel.
Have Google Analytics In Place
The first step to tracking button clicks is to have Google Analytics installed on your website. Without Google Analytics, there is no free way you can track button clicks on your website.
If you need help installing Google Analytics, look here.
Have Google Tag Manager In Place
Once you have Google Analytics installed and verified, you now need to connect it to Google Tag Manager, which will help you manage all the specific tracking for any element of your website.
Go to tagmanager.google.com and sign in to your Google Account.
Then, if you don’t have a Tag Manager account for your specific website/brand already, go ahead and create one:
Once you click on Create account, you will see a form that will help you setup your new Tag Manager account:
Name your account name the name of your brand, change your container name to the exact URL of your website, choose Web for target platform, and then click Create.
Once you do, Google might ask you to agree to their terms. Go ahead and choose if you agree or not.
Upon account creation, Google will first help you install Tag Manager onto your website by showing you some code that you have to implement on your website:
Notice that there are two pieces of code that you need to implement: one in the <head> section of your website and another in the <body> section of each page.
Instal Google Tag Manager on Your WordPress Website
Let’s install Google Tag Manager on your WordPress website. Leave your browser tab with Google Tag Manager open.
Open a new tab and go to your WordPress dashboard. Once you are there, click on Plugins and search for “PixelYourSite.”
This is a plugin that will help you install the code just once, but it will appear on every page of the site so you can track buttons on every page of your site.
Once you have found it, go ahead and install and activate it.
After you activate it, go to the PIxelYourSite Dashboard and click on Head & Footer:
Once you do, you can put your Google Tag Manager scripts these areas:
Make sure that you enable the head and footer on the top left and paste the code into the fields that say “any device type.” Once you copy and paste the code in, scroll to the bottom of the page and click on “Save Settings.”
To check if you installed the code correctly, click on preview near the top right corner:
If your site is connected to your Google Tag Manager account correctly, you will see an extra slide in area at the bottom of your website. Go to your website and see if that slide in is there:
If it is there, then GTM is connected to your site correctly.
Add Button Tracking in Google Tag Manager
Now that Google Tag Manager is installed correctly, we can configure it to start tracking important button clicks.
In this scenario, we are going to be working with external food delivery companies that we have on the website. It is important to know how many clicks each of these food delivery company buttons are getting because we want to compare the clicks from our own traffic into the amount of orders in each food delivery company.
We will be using DoorDash and UberEats buttons, then tracking each button.
Out of the box, Google Tag Manager doesn’t let you track everything. You have enable it first before you can track specific items.
Let’s enable them by first clicking on Variable and then Configure:
Then a side slide-in will show up. Scroll down until you see the “Clicks” section and checkbox all the items under the “Clicks” section.
Then click the X on the slide-in box to exit the slide-in box.
You should now see that all the click options are in your “Built-In Variables.”
Once you have confirmed that, click on “Tags” in the left side menu, then click on the “New” button to create a new tag.
A tag is something that we place on an element on our website. It is very similar when there is an “On Sale” tag at a grocery store. We place it there to let us and other entities be more specific about that element.
You can see that I already created a tag for DoorDash and another for UberEats. But don’t worry, I’ll be recreating them with you.
After you click new, a slide-in window will appear from the right.
Here, you can name your Tag. I labeled mine as DoorDash Demo but you can name yours the name of your delivery company.
To set up this tag, first click on the tag icon in the middle of the screen. After you click that, another slide-in window will appear from the right. Select Google Analytics: Universal Analytics to connect your Google Analytics account to this tag.
After that, you will see the Google Analytics has been applied to the Tag. Then it will ask you what kind of metrics you want to apply towards Google Analytcs. Since we are working with button clicks, let’s set track type to Event.
Then you can type in “button” for your category, “”click” for your action, and “doordash” for the label.
To give you a little bit more context with what you type into these fields, the text that you type in these fields will appear in Google Analytics. Here’s an example of what you will see in Google Analytics based on what you type in.
So you can put whatever text you want in those fields, but make sure they are recognizable and relevant to you so you know how to sort through the metrics later.
Make sure the correct Google Analytics property is connected to this tag.
Then scroll down until you see the Triggering area. Click on the Trigger icon:
Once you do, another slide-in window will appear from the right to give you options for Triggering.
In this Triggering section, we will be setting up what adds a tally to the category, action and label metric for Events within Google Analytics.
Click on the + icon on the top right corner to create a new trigger:
Then title the Trigger and click on the gray icon in the middle of the screen to open yet another slide-in window that will appear from the right:
Select All Element in the “Click” section because that’s exactly what we will be tracking – clicks!
Now you have the option of letting the trigger fire on all click or some clicks. We definitely don’t want just any click triggering our DoorDash button tracking. We only want DoorDash button clicks triggering our button tracking.
So select the “Some Clicks” radio option, then select “Click ID” in the first dropdown, “contains” in the second dropdown, and type in DoorDash into the third field.
What we are doing is telling Google Tag Manager that only the elements on our website which have an ID of DoorDash will trigger our DoorDash button click tracking.
We will set the ID of the DoorDash button coming up soon!
Click on save to save this trigger. Save your tag as well, then let’s move forward on settings the ID of your DoorDash button to “DoorDash.”
Set Your Button With The Right ID
Go to your website editor where your DoorDash button is.
If you implemented the DoorDash button as an image with a link inserted into the image, then your code for your DoorDash button may look like this:
If you can’t read HTML or CSS code, don’t be intimidated. I will walk you through exactly where to put what just to set the ID of your DoorDash button to “DoorDash.”
[SHOW VIDEO HERE]
Once you have implemented the ID into the button, let’s check if it works! Go back to Google Tag Manager and make sure all of your recent changes have been saved by clicking on the Submit button in the top right corner.
After you click Submit, a window will slide in from the right. Click on Publish.
After you publish, go back to the main screen and click on the white Preview button that is next to the Submit button. Do you remember doing this in the beginning too?
When the previewing is activated, you will see an orange area near the top of your Google Tag Manager dashboard that will tell you that the previewing is ready.
The preview button actually brings up an extra window on the bottom of your website when you are viewing it. This extra window tells you if Google Tag Manager is tracking the clicks that you set up.
After you click on preview, visit your website.
The bottom window should show up (don’t worry, it shows up for you only and not other people visiting your website).
Once you’re there, click on your DoorDash button. If it fired, you will see it in the bottom window under the “Tags Fired” area.
And now you are tracking any time someone clicks on your DoorDash button, which can give you some data to work with when you are wondering why your DoorDash orders were up or down.
You can definitely keep going back to Google Analytics to keep checking on how many people clicked on your DoorDash button, or you can send yourself reports on a schedule via email so you are always updated!
Now that you have this data, how do you see this data changing your decision making?