In this video, I'm going to show you how you can pull your contact information from your
Active Campaign into the Google Tag Manager data layer to customize segment and personalize
your tracking and website.
All and more, coming up.
Hey there,
welcome back to another video of measureschool.com teaching you the data-driven way of digital
marketing.
My name is Julian.
And today we want to talk about how we can pull data from our Active Campaign account
into Google Tag Manager data layer.
Now, it's oftentimes the case in our tracking that the data actually lives in different
places.
There's Google Analytics, there's Facebook analytics.
And there's sometimes also your CRM system like Active Campaign where you have the data
and rich data really available that you could use in different tools.
But it's just not there.
Because the tools don't talk to each other.
So for instance, in Active Campaign, we have rich profile information about the user that's
actually visiting our website.
Now, if we just had that information available in Google Tag Manager.
So I've written a little bit of an App Script that actually makes these two tools talk to
each other.
So we can pull information from Active Campaign right into our Google Tag Manager data layer,
and use it from there for personalization, segmentation, and customization of our tracking
and of our website.
If you want to get a hold of the script and check out the link down below.
But if you want to learn how to install it, and how to use it, and we got lots to cover,
so let's
dive in.
All right, let's first take a look at what we are trying to accomplish here.
So I've sent myself an email newsletter from Active Campaign.
And when I click on this link, I go to our demo shop.
And please notice up here we have our contact the hash in the URL.
This will then be connected to Google Tag Manager will pick that up and send that information
over to AC via a tag and that tag will then receive information which will be pushed into
the data layer.
As we can see here, we can see what the data layer information is then available to us.
We have subscriber ID, we have the sign-up date, the email address, first name, and last
name, how many times it bounced.
So there's a lot of information available in this data layer, push now, including custom
fields that we might have said, and even the actions that the user has taken, which automation
he is which tags he has attached to his user profile.
Really just mimicking what we can see inside of our contact record in Active Campaign.
So this is great information that we can use with Google Tag Manager to customize our website
for the user.
So with the help of Google Tag Manager, we can pull out this information and customize
or segment or personalize our appearance on our website.
So for example, here, you pull data out of the data layer and filled out a pre-filled
this form fields with the email address that we have in the data layer available.
So really great information that we can get from Active Campaign.
How do we get it there?
Well, let's go through the steps.
First of all, we need to build an API proxy with the help of Google Apps Script.
So this is the App Script that I have written in order to pull the information from the
Active Campaign API.
And we would need this proxy in order to not expose our API key on the client side.
Luckily, App Script is free.
And you can simply open up the script and then go to File, make a copy in order to make
your copy on your Google account.
Once it's on your Google Drive account, we need to do some configurations in order to
get this working.
First of all, we would need to replace the xxx here with our Active Campaign API URL,
you can find that in your Active Campaign under the settings you find here, developer,
and there's where you get your URL and your key.
So first of all, let's go with the key, copy that over to our script.
And then we have our URL.
And we copy that over to here as well.
Once this is done, you can take a look at the code here, it really just takes up some
information from the URL that we're going send to it, and then sends it on to Active
Campaign, gets a response back, and forwards it on in JSON format back to our client.
Now, all you need to do is save this
and then go over to publish here and deploy this as a web app.
Now, you can leave these untouched, the only thing you need to change is the last step
here, Anyone even Anonymous, click on that and then deploy.
It will ask you for some permissions as you are deploying a web app here.
And this web app will be accessible to the wider internet.
So you need to confirm this with your Google account.
It will connect to external services, which in our case is the Active Campaign API.
And we get our web app URL.
So this is the URL you need to copy because we will need it later again.
Now, in order to make this all work, you would need to have something set up in your Active
Campaign as well.
And this is the links that go on to your website.
So every time you send out an email, let's go over to our test campaign here and you
design a new campaign, all the links that point to your website actually need to be
correctly tagged.
So you see here we have a link that is pointing to our demo shop.
And we need to attach a special tag in order for our script to work.
And this is the subscriber hash.
Now, if you don't have any kind of query parameters in the back of your URL, you would write a
question mark, and then write the AC ID, which is the Active Campaign ID equals and then
you put in a personalization tag that you might know from Active Campaign which is surrounded
by these percentage sign and you'll write in in all caps SUBSCRIBER_HASH.
You would need to do this for every link in your newsletter, or in the designer of your
email that goes out that actually points to your website in order for these people to
be identified.
This is how the information gets from Active Campaign to your website and is picked up
by Google Tag Manager, at least the identification part.
Now what this will do, let's send out a test newsletter here,
you will get your newsletter in your inbox.
And once you click on it, it will actually replace that subscriber hash with the actual
subscriber hash of that user, which we would need to identify the user correctly with our
API.
Now that we have the information on the website, we will just need to pick it up and query
the API for the right information and then push it back into the data layer.
This is something we will do with Google Tag Manager.
So I have Google Tag Manager installed on this demo shop here.
And the first thing we need to do is to pick up whatever is in this AC ID field.
Luckily, we have the ability to do this with Google Tag Manager in the variables, we can
build a query parameter variable.
So let's go here on the variables, user-defined variables, click on new and as the type, we'll
choose the URL variable.
The component type will not be the full URL, but the query and we can put in a special
query, which in our case, is the key that we see up here.
And our key is AC ID.
So let's type this in
and gives this all a name,
save this,
and it's right out.
Let's refresh here, go back to our demo shop.
And then under variables, we should see our URL AC ID is now filled with this particular
subscriber hash.
The next thing we want to do is to actually build a trigger every time there is a subscriber
hash because we don't want to fire our tag and do an API query if there is no hash available.
So let's build a trigger in Google Tag Manager.
This will be a simple trigger that is evaluated on the page view event.
And we only want to fire this on some page views where our URL AC ID is actually filled.
That means in Google Tag Manager terms, it's not equal to undefined.
Let's give this all name.
On the page view, AC ID is present.
Let's save this, we can really test this, we would need to attach this all to a tag.
So let's build our tag that actually does the API query or really talks to the Google
Apps Script here and the Google Apps with them makes the query and sends it back to
our tag.
We are simply building a listener for our Active Campaign contact information.
This will all be done via a custom HTML tag.
And I have something prepared here
that I'm also going to link up down below.
So you can copy this.
And all you need to do is now replace the placeholders here.
So this needs to be your App Script URL, just copy this and put this in here.
And then replace this with the variable name of your subscriber hash.
Now, we have built a subscriber hash beforehand.
So we'll just type two curly brackets.
And this will open up this little menu where you can choose your URL, AC ID, and this will
be automatically replaced once the user comes in.
This looks all good.
Now, let's attach the trigger that we had built previously and saved this all.
Refresh our preview and debug mode, go back to our page, we still have the AC ID here
in the URL, let's refresh and we see our listener has been deployed, it sends a information
to our App Script, the script information, sends it on to the API, the API response and
pushes back into the data layer with a special event called AC user.
So once you click on that, and look into the data layer, we have all this information now
available about our user.
And this would be obviously different per user that clicks on that specific link in
the email, they have a different subscriber hash and different information would be pulled.
So this is how you can set up the contact information push into the data layer.
By the way, if you're interested in the listener functionality, it's really just an AJAX call
that we're doing to our App Script, we are passing on our Active Campaign ID hash and
feeding that back into the data layer.
The only thing that we change in this data layer is that we use a special event key called
AC user, if you want, you can change that.
But that's really it.
In the end, what can you actually do with the data now that we have it in the data layer?
Well, first of all, you can pull it out of the data layer via data layer variables.
How would you do that, let's pick a couple of here we have the first name, we have the
email address.
Yeah, let's take these and put them into our variables.
Click on New User-Defined variables.
This will be a data layer variable for the first name.
And we'll just choose our data layer, variable type.
And then we need to have the key of the data layer itself.
So in our case, that would be the first name key right here.
And we'll just paste it in here.
Let's save this.
And we want to have another key, which is email key.
So just the new data layer variable with our email key,
and we have this as well.
So once we refresh and refresh our page,
we should have that information available in our variables now, right here email and
the first name is filled out.
Now we can use that data to actually customize or segment our data.
Let's take this newsletter widget as an example.
Now, since the users identified you already know the email address, so you could pre-fill
this form field in order for them to have it easier to sign up for the newsletter.
How would you do that?
I have a little bit something prepared he already we have these onset action items.
And here's a little bit of JavaScript that will select the form field and then give it
a special value.
In our case, we want to fill this with our email value.
We need to attach a trigger to this.
And we will choose a new trigger that is actually a custom event.
Because we need to have that data available at the right time, which is the AC user event.
So let's take our custom event trigger here, which we will fire on the AC user event, once
that information is available, or custom events, that's fine, which is choose our custom AC
user, let's save this and attach this to our tag as a trigger, we refresh and refresh your
page.
And as you can see, it changed over to the actual email address that we have in the data
layer, which is pulled from our Active Campaign information.
A second thing I want to show you is changing text here, personalizing the website, you
could do this in many different forms will just do this for now in the text form, which
we have done here.
Again, I'm just selecting the right elements in the document object model and then assigning
a new text to the node.
In our case, we want to have our first name, but not just the first name we have Hi there
so it would be
alright, so that should do it.
Let's try this out, refresh.
And we have an unsupported reference.
That's because I now have commented out our deal, the email address, and it still has
our variable in here, which is not allowed.
Let's refresh and see if our script works.
And now we see Hi, John, it has changed it depending on the user.
Again, that comes from Active Campaign.
And you could also obviously use this for segmentation.
So trigger a tag based on the user that is actually on the page itself.
So for example, let's say I completely don't want to show this at all if a user is already
identified as a newsletter subscriber, because why would he actually need to sign up again
when he's already coming from a newsletter?
Well, that's also something we can use for our tags.
In our action items, I have a little JavaScript to get rid of this that actually hides the
element of our widget.
Now, all we need to do is actually simply use our trigger here and refresh our page,
refresh our site.
And now we see our widget has gone.
You might have noticed that there's a little bit of a flash effect.
So the page changes after the initial page load.
And that is because the API needs to be contacted first, and send information back in order
for us to decide whether we want to show this or not.
This is an obvious downside of this method.
We need to wait till the API comes back with information in order for us to customize the
website.
There are workarounds with A/B testing tools that you might know of.
But this is just the nature of getting the information first, before doing an action
on the website with JavaScript.
The other concern I want to address is you may be thinking, well, this seems to be all
personally identifiable information.
How is it with our privacy laws?
Well, yes, there is personally identifiable information in here.
Therefore, I would recommend to not pull certain data points, like the first name and last
name into tools like Google Analytics, but for our purposes, and what the script does
anyway, is it just exposes the information that the user has given us previously.
It also exposes only the information of the user that is actually on the website, we can't
read any other information.
And it doesn't save that information in Google Tag Manager.
Because if I actually navigate on to the next page, we don't have the Active Campaign ID
up here anymore, and our data layer won't be filled with our AC user information.
Which brings us to the next question which is obviously it only works when the user just
came from the newsletter or from the link of the email that he clicked.
That's true, you could take this data layer information and push it into something like
local storage or a cookie in order to have it available later on for personalization
purposes.
But that's something we covered in other videos on how to persist data with Google Tag Manager
in cookies for example.
Alright, so there you have it.
This is how you can pull your contact information of the user was visiting your actual website
at the moment from your Active Campaign account into the Google Tag Manager data layer and
use the data for segmentation, customization, and personalization of your tracking and your
website.
Now, the possibilities are really endless here.
So I'd love to hear from you.
How are you planning on using that data?
And what is your use case really.
Leave a comment down below we can all learn from each other.
And if you liked this video, why not give us a thumbs up and also subscribe to our channel
right over there.
Because we'll bring you new videos just like this one every week.
Now my name is Julian.
Till next
time.
For more infomation >> Digital Journalist Nia Wesley talks colored pencil nails, Panera's double bread bowl - Duration: 2:23. 
For more infomation >> 《遮天》无始大帝竟然是一个"暴脾气？"那么谁又值得他动怒呢？ - Duration: 3:44. 
Không có nhận xét nào:
Đăng nhận xét