Wouldn’t it be great if you could send website event data to ActiveCampaign?
ActiveCampaign is a great tool for implementing your marketing campaigns. However, the process becomes a little complicated when we try to send the user information from Google Tag Manager to the ActiveCampaign account.
In this guide, we’ll learn how to set up a tracking method that can send the user data from the Google Tag Manager to the user profiles in the ActiveCampaign account with the help of Google Cloud Functions.
If you’re new to Google Tag Manager, we’d suggest checking our Google Tag Manager tutorial first to go over the basics.
An overview of what we’ll cover:
- An overview of event tracking with Google Tag Manager
- How the tracking method works
- Website user identification
- The templates you will need
- Google Cloud setup
- How to build Cloud Functions/create Cloud Functions
- ActiveCampaign ID and event key
- Deploy your Google Cloud Function
- Function permissions
- Sending first test data into ActiveCampaign
- Setting up an event tracking template
- Tag configuration
- Initial testing
- Add a trigger
- Setting up variables
- Final testing
- Adding a dynamic user id to links
- Pulling user id from “URL” into Google Tag Manager
- Capture user id in a cookie with Google Tag Manager
- Pulling user id from “cookie” into Google Tag Manager
- Creating a blocking trigger in Google Tag Manager
So let’s start!
An Overview of Event Tracking With GTM
ActiveCampaign makes a large number of digital marketing applications available for use.
However, the process becomes complicated if you want to send the customer data from your Google Tag Manager account into the ActiveCampaign account.
You’ll need to install a proxy here so that your ActiveCampaign and API keys don’t get exposed.
In a previous edition, we recommended configuring the Google App Script as an intermediate step between ActiveCampaign and Google Tag Manager.
However, it is now an outdated method. Additionally, due to the hassle while setting up the same, we came up with this new method.
You could also use Zapier. However, it isn’t built for tracking. So as you expand your data level on Zapier, it will become expensive in no time.
We found that Google Cloud Functions, a product under the Google Cloud platform, can be helpful here.
We can use this as a proxy and send data from Google Tag Manager to Google Cloud Functions, and finally send that data into ActiveCampaign to trigger the event tracking system.
Google Cloud Functions is not only cost-effective, but it’s also reliable because it allows us to keep a log of the data. Hence we can see the process in real-time.
To simplify the process, we have broken it down into four major steps.
First, we’ll get an overview of the entire process.
Next, we will be setting up the Cloud Function. This will act as our API proxy that enables us to send our data to the ActiveCampaign account.
In the third part, we’ll set up a custom Tag template. We have specially developed this Tag for ActiveCampaign API that will enable us to send data from Google Tag Manager to the Cloud and finally to ActiveCampaign.
In the fourth part, we’ll use specific techniques that will enable us to identify a user when they access our website and re-identify them when they take an action on our website. We’ll also learn to send this data to ActiveCampaign API.
The fourth part is essential because it helps us to recognize users when they come to our website and what actions they perform. This helps us in making our system more effective.
Let’s get started!
How The Tracking Method Works
We want to send the event tracking information from our website to a specific ActiveCampaign contact.
For example, if a user clicks on our website, our goal will be to send that information to ActiveCampaign.
However, sending the event tracking information for different users is not as easy as creating a Tag on a page.
This is because the event tracking information contains specifics that allow the information to be sent after a user has been identified.
You need to send an Event Key along with the data to successfully track the users.
Since this key needs to be confidential, we built this unique mechanism.
We’ll first set up a Cloud Function on the Cloud platform. Then, we’ll send the data from Google Tag Manager to the Cloud Function.
Finally, this Cloud Function will transfer our data to the ActiveCampaign. We’ll then need to find the correct user profile and forward the corresponding information.
Towards the end, we’ll successfully be able to create the Google Tag Manager deployment.
We’ll be using the Cloud Function Proxy URL and User Identification Method as Contact ID, Event Name, and Event Value.
We’ll also add a trigger to fire the Tag on a specific event on Google Tag Manager.
Finally, the last part of the tracking deployment will be about user identification.
Website User Identification
We need to identify the correct user when they come to our website and send the corresponding data to the right profile in ActiveCampaign.
One of the easiest ways of executing this process is to attach a URL with a unique query string in an email that we send to the user.
When the user clicks on that link and lands on our website, they will have a particular URL with a unique string attached.
This will act as a contact record to uniquely identify the user to send further information.
We need to retain this information because we may lose this string once the user jumps to any other URL on our website.
Hence, we’ll build a cookie to remember the string that was generated from the email.
So at the end of this process, our Tag configuration should have all the essential information that we have spoken about.
We’ll also preview and test our Tag at the end.
So open the website from the URL in the email with the string attached.
In this case, the string number is three.
Let’s also go to any other sub URL to see whether we can track the user now. In this case, we performed an Add to Cart Click event.
We’ll open our Google Tag Manager to check any Tags that were fired.
Click on the Tag to open the details. We’ll see the correct user profile saved in a cookie beside the Active Campaign Contact ID.
We can also relocate our user under a similar sequence number in the contact record.
We can track all the Recent Activities made by the user when we click on it.
Additionally, there are a few things we need to take care of for this process to work.
The Templates You Will Need
The first requirement is to set up a Cloud Function. This will act as our proxy where we’ll be sending our data.
Next, we need to set up ActiveCampaign event tracking from Google Tag Manager. We’ve created a custom Tag template for that.
Finally, we need to find a process to identify a user with an email link, send that information to the right profile, and remember it through a cookie.
Let’s start with the first step toward implementing this process!
Google Cloud setup
The first step is to set up the Active Campaign API and connect it to our Google Cloud Function. But to connect it to Google Cloud Function, we’ll need to first set up the account.
We’ll need access to the Google Cloud Console for the Google Cloud Platform to set up Google Cloud Function.
We’ll go to the Google Cloud website. You can log in to it with your Gmail account, or you can sign up for a new account as well.
As soon as you log in to your new account on Google Cloud, you’ll receive a credit of $300 for joining.
However, you’ll still need to enter your credit card details to process this setup further.
Adding a credit card to the process will enable us to send data to the system from an unauthenticated endpoint, which is an essential aspect of our process.
Once you’ve signed in to an account on Google Cloud, click on Go to console.
This is where you’ll be able to find all your different projects with Google Cloud. But if you’re new to this, then click on New Project.
Give a name to your project. Then click on Create.
We now have a project under Google Cloud.
Our next step will be to set up a billing process.
On the home screen, click on Billing.
You’ll need to enter your account details here to successfully set up a billing process for Google Cloud.
Furthermore, Cloud Functions are relatively cost-effective. For thousands of events that you may send per month, the charge will remain a few cents.
But if you have a more comprehensive range of audiences on your website and you send millions of events, the charge can go up comparatively.
However, we still find Google Cloud to be more cost-effective than other portals like Zapier.
Once we have our account set up, we can start to build our Cloud Functions.
How to Build Cloud Functions / Create Cloud Functions
Click on the Cloud Functions option on your home screen. You can also click on the pin icon to position it at the top of the home screen.
Once you’re on the Google Cloud Functions screen, click on CREATE FUNCTION to create a new function for our Active Campaign event.
Add a Function name so you can track it without hassle. You can also choose a Region for your campaign depending upon the type of requests you want to receive.
Click on the option to Allow unauthenticated invocations. Also, click on the option to Require HTTPS.
Click on Save once you’ve filled all the fields stated here. We’ll now go to Next.
This will redirect you to a menu. Click on ENABLE API, which will enable the Cloud-built API.
This will open a new window. Click on ENABLE.
This might take a while to enable. Meanwhile, we’ll go back to our Google Cloud page. You’ll need the codes for the index.js file here.
The codes are available in our repository.
Open it and click on index.js.
Now, click on Raw to open the codes.
Copy the entire code from here. Open our Google Cloud page again. Replace the existing codes with the ones we copied from the repository.
At the very top of this code, you’ll need to fill up the information about the API key, API URL, Event Key, and Active Campaign account ID.
First, we’ll fill up the API key and URL. Open your Active Campaign Account for this information. On the homepage, click on Settings.
Once the page loads, click on Developer. Here, you’ll find the API Access information. You can copy your API key and URL from here and paste them into the codes on index.js.
As a rule, this information should not be shared with anyone. However, we have created a demo account for visual purposes only.
Once you add your information to the index.js code, you can be sure that your information won’t be shared publicly with anyone.
We just put this information to execute the Cloud Functions. Ensure that even after replacing your information on the codes, you have still retained the quotation marks.
We’ll now learn how to fill up the ActiveCampaign ID and Event Key.
ActiveCampaign ID and Event Key
Let’s go back to our Active Campaign account. Go to the Tracking option below the Developer.
We can see the Tracking Code here. We can find the Account ID in the code itself. Copy it from here and paste it into our index.js code.
Let’s come back to our ActiveCampaign account. You can find Event Tracking under the Tracking code.
You’ll have to keep the Status as ON in case it isn’t. You can find your Event Key just below the ON option.
Copy the key from here and paste it to the index.js code on the Google Cloud account.
Once all information has been added to the index.js code, click on package.json.
You can find this code as well in our repository. Click on package.json.
You can directly copy the code from here and replace it with the code on your Google Cloud account.
Now we’ll need to export the function while going to the endpoint. Hence, copy the function from the index.js code, and paste it as our Entry point.
Let’s deploy this function now.
Deploy Your Google Cloud Function
Once done, we’ll click on the DEPLOY option.
This may take a while to load.
We’ll be able to see that our Cloud build API is now enabled.
Next, we’ll learn how to whitelist the events.
Whitelisting Events in ActiveCampaign
We’ll now come back to the Tracking section in our ActiveCampaign account.
We need to Add Event to whitelist it. We’ll type the name of the event we want to add for whitelisting beside it and click on Add.
Once added, you’ll be able to see the event listed under the Event section.
Note: We can track only the white-listed events.
ActiveCampaign will now be able to receive these events.
Let’s come back to our Google Cloud account.
As mentioned earlier, we need to Allow unauthenticated access to our Function. We’ll be able to check it once our Function has been deployed.
You can also see them manually by clicking on PERMISSIONS on the top of the screen.
We can see that it will allow allUsers access in the description as well as Cloud Functions Invoker.
If you don’t already have allUsers access, you’ll need to set it up in order for this process to work.
We’ll now click on our event that has been deployed.
It will lead us to the overview menu. It can show us how often an event was invoked.
You can check the Logs to see if there were any errors for any events that have been invoked.
Let’s now see how to send this data to our ActiveCampaign account.
Sending First Test Data Into ActiveCampaign
We’ll first need our Cloud Function URL. So, we’ll click on EDIT.
Copy the trigger URL from here and paste it on your Notepad.
Currently, this URL won’t work because we haven’t attached any information to it.
However, we need to attach a testing string to the URL. You can find this string from our repository.
Under Testing, you can find a string for Cloud Function URL. Copy this as well and paste it to your Notepad.
Once you’ve copied the URL correctly, you also need to fill in your information.
We’ll need to replace the EVENTNAME, EVENTDATA, and CONTACTID from the string given in the repository with dummy data to test it.
Let’s open Contacts on our ActiveCampaign account and create a dummy contact to test this data. Click on Add a contact.
Fill up the test data for a person, and click on Add.
Once you’ve added the information, you can also add Contact Actions. Choose any particular action and click on Apply.
You’ll now be able to see the test user data on your screen. Click on it to get more information.
You can find the contact ID from the URL of the profile. In this case, it’s 2.
We’ll copy it and replace it with the CONTACTID in our testing URL.
We’ll also need to fill up an event name. We have already whitelisted a few events in the Tracking column of our ActiveCampaign account.
We can choose and copy the name of any one of these events. In this case, we’ve copied testing.
We’ll replace EVENTNAME with the event we copied.
We’ll also replace EVENTDATA with any random property of an event.
We’ve chosen to add CloudFunction here.
Once your entire URL is complete, you can copy and paste it on a new tab and press enter to load it.
We’ll be able to see a message on the screen “sent event”.
We’ll now be able to see this event on our Google Cloud console.
It may not be visible right away. However, you’ll be able to see the user movements under the user profile that we created.
We’ll be able to see the event name that we entered for the user, testing, in this case.
The event can be seen as testing, and the event data can be seen as CloudFunctions, just like we entered.
Now our Cloud Function is ready to operate!
Setting up Event Tracking Template
We’ll move on to the third part of our guide to set up a custom Tag template that you may install.
First of all, we’ll open the GitHub repository. Click on ActiveCampaign Event Tracking.tpl, and open the Raw file.
Once the Raw file is open, click on Ctrl + S in order to save this file to your system in the tpl file format, and click on Save.
The file will now be saved to your system.
Let’s open the Google Tag Manager account that is linked to your website.
We’ll need to set up Tags and triggers for our process from scratch.
Open Templates on the home screen, and click on New.
Now go to three dots on the top of the screen, and click on Import.
Open the tpl file that we just saved.
Once it opens, you can also check the code on the Template Editor. But ensure that you don’t make any changes to this file as it may not work otherwise.
Save the file once it’s installed from your system into our template.
We recommend you manually download them from GitHub as these codes can’t be found in the community gallery.
Cloud Functions may not be the standard way of performing this tracking, but we still recommend it due to its cost-effectiveness and ease of setup.
Once ActiveCampaign is installed as a tech template, we’ll create a New Tag with ActiveCampaigning Event Tracking as its Tag type.
Now we need to add Tag information as well. The first one is Cloud Function Proxy URL.
This will be the same URL as our Cloud Function URL. So, we’ll go to our Function on the Google Cloud account and click on EDIT.
Copy the trigger URL from here and paste it into your Tag.
Let’s see what else needs to be added to this Tag.
We’ll need to put in the event information like User Identification Method, Event Name, and Event Value.
First, we’ll choose the User Identification Method. Previously, we chose Contact ID as the method because we already had that information.
However, you could also use other methods here. You can use the User Hash that you already have in the background.
You can also use an Email Address, but we don’t recommend it due to PAI reasons.
For ease of the process, we’ll again move forward with the Contact ID.
Next, we’ll fill up the ActiveCampaign Contact ID. we already know this field, so we’ll fill up the Contact ID of our test user, which is 2 in this case.
Next, for the Event Name, we’ll again go with testing.
For the Event Value, we’ve just put in any value. We’ll put GTM in this case.
We’ll also add a trigger for our Tag. We’ll choose All Pages as our trigger type.
Let’s add a name to the Tag and Save it.
Our next step will be to test the Tag we just created.
So let’s see if it works!
Let’s preview our Tag on the website we have linked.
We’ll be able to see that our event has been fired on the Google Tag Manager account.
Also, when we open the test user profile on the ActiveCampaign account, we’ll be able to see the corresponding event recorded.
So we’ve been successful in sending the event data from Google Tag Manager to the ActiveCampaign account.
However, this is just for testing purposes. The trigger used here is All Pages.
So if the user keeps on moving to the next pages continuously, there would be a tracking known as sidetracking that will go on.
In order to prevent this, we need to customize our trigger.
Add a Trigger
Let’s reopen the trigger from our Tag. Add a new trigger.
Add a name to the trigger. Here, we’ll try to create a trigger for the click event of add to cart.
We’ll choose the trigger type as Click – All Elements.
We’ll set the trigger to fire on Some Clicks.
Our conditions will be Click Text contains Add to cart.
Once done, click on Save.
Once the trigger is done, we’ll also make a few changes to the Tag.
Setting up Variables
We’ll add the Event Name as a click.
Make sure that the event names you choose are already whitelisted.
We have previously whitelisted a few events. Make sure that you choose an event from them. Otherwise, it won’t appear on the ActiveCampaign account.
For the Event Value, we’ll choose Page URL as the variable.
Once done, click on Save.
Let’s test it in Preview mode to see if it works!
We’ll go to our website and add a product to the cart. When we come back to our Google Tag Manager account, we’ll be able to see that the event has fired successfully.
You can also see the same information on the test user profile from your ActiveCampaign account.
You can see the page URL shown in the event because that is how we have created it.
Our next step will be to identify a user.
We already know the Contact ID of the user that performs actions on our website. But now, we’ll find a way to dynamically identify this user as well to send this data to the correct ActiveCampaign profile.
Adding a Dynamic User ID to Links
We’ll use a cookie technique to remember our users.
We’ll need to set this process in the Google Tag manager itself. Here, we’ll change the way a user is identified in the Tag itself.
Currently, we are manually providing the contact ID of the user inside the Tag itself. We’ll replace it with a dynamic system.
So when a user comes to the website, we’ll identify the user and the corresponding profile on the ActiveCampaign account, and finally, we’ll send the data to the correct profile.
There are several ways to do this process. The one which we recommend needs us to identify the users by links sent through emails.
This is the most effective method in this case, as ActiveCampaign is also an email tool.
We’ll send the email to the user with a link inside it. Once a user opens our website through the link provided, we’ll be able to track the user data with the help of the string attached to it.
How can we send such information from ActiveCampaign?
Emails from ActiveCampaign can be sent by campaigns, automation, or directly from the user profile.
For testing purposes, we’ll choose to send an email from the user profile itself in the ActiveCampaign account.
Click on Send an email.
We can now send personalized information from the mail itself. For example, if we type “%”, it will direct us to convert it into a lot of other options. We’ve chosen the first name on the user profile.
We’ll also add a link to this email. Let’s type the website address in the link.
However, we’ll need to add a query string at the end of this link. We’ll be including the account ID for this link.
Hence, the string that we add after the website address will be /?acid=. We’ll also add the custom contact ID of the user to track them.
So, we’ll also add %CONTACTID% at the end of the string after the “=” sign.
We’ve chosen contact ID here because it’s the easiest method for our Tag configuration. However, you can also choose email if you are careful with it. In this case, the CONTACTID will change to EMAIL.
Also, you can choose the subscriber hash option which is in sync with the Tag configuration. In this case, the CONTACTID will change to SUBSCRIBER_HASH.
We’ll go with the contact ID for convenience in the process. So, we’ll add the whole string “/?acid=%CONTACTID%” at the end of our website address, and click on OK.
Send the test email once done. Let’s open the link from this mail to see how it works.
We can see that once the link opens, it suggests the exact ID number of the person as in our ActiveCampaign account.
Let’s see how to add this contact ID information from the ActiveCampaign account to our Google Tag Manager account.
Pulling User ID From “URL” Into Google Tag Manager
First, we’ll need to create a new variable.
Open Variables, and click on New.
The type of variable will be the URL variable, and our Component Type will be Query.
We have chosen a Query key of “acid” for this purpose.
Add a name to the variable, and Save it.
After saving, we’ll see if this works.
Let’s open the preview mode for our variable on the website.
For testing the query, we’ll reopen the URL we mailed earlier for checking the contact ID of the test user.
Once the website opens, we’ll come back to Google Tag Manager to see if it fired correctly.
We can check in the Variable section the url – acid is showing a value of 3, and has been fired successfully.
However, once we shift from the current page we opened on our website to any other page, we’ll be able to see that the string has disappeared from the URL.
Let’s see how to track user movements in such cases.
Capture User ID in a Cookie With Google Tag Manager
In this case, our current Tag variable won’t be able to identify the user movements anymore.
Cookies are a great way to track user movements irrespective of the number of times they change the URLs. We can always track them as long as they are on our website.
Let’s create a cookie now.
You can create a cookie in Google Tag Manager itself. Open a new Tag.
We’ll choose the Tag type from the Community Template Gallery.
We’ll search for the keyword “cookie”. We’ll be able to see many different solutions for creating cookies. Not all of them can actually make cookies.
We have already tried out the Custom Cookie Tag for you, and it works properly. Click on it.
Click on Add to workspace.
Our Tag template is still open. Add a name to it.
The Cookie Name can’t be changed to anything else. So we can just add any cookie number for it.
We don’t need to fill in any Optional Description.
Choose the Cookie Value as url – acid, the one which we have already created here.
Save it once done.
We’ll also attach a trigger for this Tag.
Choose the trigger type as Page View.
We’ll command the trigger to fire on Some Page Values.
We’ll keep the conditions as url – acid does not equal undefined.
This is because we want to track the user when we already have a definite url acid and can put this value in the cookie.
Add a name to the trigger, and Save it.
Also, save the Tag. Let’s go to Preview mode and see how it’s working.
Let’s again open the URL which contains the acid string along with the user ID, which is 3 in this case.
Once the page has loaded, we’ll open the developer tools. Right-click on the website page, and click on Inspect Element.
Go to Application → Cookies. You’ll find a list of all the cookies here including the cookie that we just created, custom cookie 7.
This will also show a value of 3, as our user ID is 3 in this case.
Even if you change the page you are currently on, the cookie will still be there.
However, we still need to pull this information from the cookies into our Tag.
Pulling User ID From “Cookie” Into Google Tag Manager
We’ll create another variable on Google Tag Manager.
The variable type will be 1st Party Cookie, and Cookie Name can be copied from the developer options themselves.
The name is customCookie7 in this case. We’ll add a name to the variable and Save it.
We’ll also implement it inside the Tag we created. We’ll change the ActiveCampaign Contact ID to customCookie7, and Save it.
Let’s preview this and see how it works. In order to preview correctly, we have deleted the previous cookie track to set new ones.
Let’s reload the URL with the string of user id.
We’ll be able to see that our Tag has already fired on the Google Tag Manager.
We’ll also open another page on our website, so the URL doesn’t contain a string anymore.
We’ll try to add a product to the cart. We’ll also be able to see that our Add to Cart Tag has also fired.
The Tag also shows the ActiveCampaign Contact ID as 3.
We’ll also see if this information is visible on the ActiveCampaign profile of the user.
We’ll be able to see that the Click event has occurred on the user profile.
You can even try to open other pages on your website with the same user ID, and you’ll still see that the Tags will fire.
As long as the user won’t change the browser or delete the cookies, we’ll still be able to track the movements on our website.
However, you’ll need to make sure that any links you send to the users should have the query link attached to them.
Unfortunately, there’s no other way to track this information by sidetracking on the ActiveCampaign.
One thing we need to ensure here is that our process won’t track the users who come to the website without any query string attached to the URL.
Creating a Blocking Trigger in Google Tag Manager
We need to build a negative trigger or a blocking trigger.
We’ll create a new trigger with the trigger type as Custom Event.
The Event Name will be all the events. Hence, we’ll type “.*”.
We’ll click on the option to Use regex matching.
We’ll set the trigger to fire on Some Custom Events.
Our conditions will be cookie – customCookie7 equal undefined.
We’ll add a name to the trigger and Save it.
As the conditions in this trigger are counter to what we want, we’ll turn this trigger true as an exception for the one we already have.
Let’s open our Tag and add this as an exception. Save the Tag once done.
We’ll again delete the existing cookies to test the new ones correctly.
Let’s open our website without a query string URL and try adding a product to the cart. This is already a new string-free URL.
We can see that the Tag didn’t fire. This is because our counter trigger stopped it from firing.
We have made a download of this entire container and added it as well to the GitHub repository.
In case you don’t want to go through the whole setup, you can directly go to the Admin section, and click on Import Container.
You can add the container you downloaded from our repository here.
Moreover, don’t forget that if you want to take this live, you’ll need to submit this as a version.
So that’s all! This is how we can send the user data from Google Tag Manager into an ActiveCampaign account with the help of Google Cloud Functions.
Sending user data to ActiveCampaign will require you to create a proxy in order to correctly identify the users. Furthermore, tracking this data will require cookies.
However, if you have more user data on the ActiveCampaign account, instead you can pull the ActiveCampaign data into the Google Tag Manager to optimize it better.
Do you plan on using this event tracking with ActiveCampaign? What is your use case? You can let me know in the comments below!