In this video, I'm going to show you how you can connect your cookie consent form to your
Facebook Pixel.
So the data is not being sent if the user has not yet agreed to your terms.
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 connect your cookie consent form to the Facebook
Pixel.
Now, you may have installed a cookie consent form because of GDPR purposes, where you ask
the user to agree to your privacy policy and the cookies that you're about to set on his
browser.
Once he has given consent, you want to send out data to third-party tools like the Facebook
Ads tool or Google Analytics.
We actually did a previous video on Google Analytics and how to connect that with your
cookie consent form.
But today, we actually want to do this with the Facebook Pixel.
So what we're trying to accomplish is to not send any data to Facebook if the user has
not yet agreed to our terms.
And once he does, we send everything over.
Luckily, Facebook just came out with another command in the library that lets us prevent
the data from being sent.
And cues that actually up before the user has then given consent.
Once he has given consent, we can then programmatically send a data all out to Facebook Ads, or Facebook
analytics.
Now to implement this, we need to alter our tracking codes.
And of course, I do this with Google Tag Manager.
Now we've got lots to cover so let's
dive in.
All right, back in our demo shop here, we have already a cookie consent form that pops
up right here.
I've just installed this cookie consent form for insights.
This is free.
I'm not here to say this is the best.
And it might be not applicable for your case.
But just for demo sake, it was really easily installed via Google Tag Manager.
I just built in a custom HTML tag where I pasted my code.
Now, this cookie consent form has two buttons Allow Cookies and Decline.
And if we click on allow cookies, it won't appear anymore on any other site.
And what it does in the background is actually set a cookie.
So how can we see that cookie?
If we go over to our developer tools under more.
And then we have here our developer tools, you can see under the application section
down here, we can see our cookies that are set on this website.
And we have our cookie consent status Allow.
So this was set to the allow stage.
If I delete this and reload the page, obviously, the cookie consent will reappear.
And if I click decline,
it will set a cookie that sets the cookie consent status to Deny.
And again, it won't reappear on any other consecutive page load.
So now, how can we connect this to our Facebook Pixel?
I have a Facebook Pixel is firing on every page.
It's our standard Facebook Pixel that I've deployed through Google Tag Manager on this
page
by a custom HTML tag.
And we need to have a method to tell Facebook to not upload his pixel at all.
And recently, they introduced a new method, which you can find on this page here.
I'm going link that up down below that gives us the commands of consent for revoke and
grant.
What this does is if we take this revoke flag and put it into our code beneath the init
function, we can revoke consent by default.
So let's try this out,
refresh,
and reload our page.
And we see our Facebook Pixel fires.
But inside of our Facebook Pixel helper, we get an error that something wasn't right here.
The page view was not sent over to Facebook.
Now if we deploy our grant command.
And we can easily do this by going into our developer tools.
Here again, under more developer tools, we have our JavaScript console.
And here, you can enter
the code here.
That is the grant command.
So let's copy that
and just enter this year, press Enter.
And now we should see inside of Facebook Pixel helper, we have page view data now sent over,
although it was blocked beforehand.
Now these commands, we now want to connect with our cookie consent form.
We have already seen inside of our application here that a cookie is set with the cookie
consent status, deny or allow.
This is something we can use in Google Tag Manager to programmatically switch our commands.
So the Facebook Pixel grants or denies the sending of the information.
So the first step would be to actually pull out this deny value from this cookie.
How can we do that?
In Google Tag Manager, there is a built-in variable that we can use.
So let's go to the user-defined variables here and click on the type of the first party
cookie.
We just need to enter the cookie name.
In our case, that would be cookie consent status and will enter that here.
I'm going give this a name,
a cookie, and then the cookie consent status.
Let's save this
and try this out.
Refresh, refresh our page.
And if you click on an event, and then on variables, you should see our cookie consent
status should have a value of whatever's in the cookie.
So right now, it's denied.
Let's again, go into our application here in the developer tools, I'm going to get rid
of this.
Reload.
And this time, I'm going to click on allow cookies.
So right now, and nothing is in the variables because we don't have a new event.
But if you reload our page right here,
you should see that our cookie consent status is now set to allow.
Now how can we transfer that into these commands of consent grant and revoke?
But really, it's just a different wording.
We have revoked, which would be denied.
And we have grant which would be Allow.
So we just need to rewrite them really the values that we have in the cookie to revoke
our grant.
How can we do that really easily with Google Tag Manager?
It's possible by a lookup table variable.
So just go into the variables here.
And under lookup table variable, we can choose the lookup table variable right here.
And what lookup table variable does?
It looks at a certain input variable.
So in our case, we want to look at the cookie status.
And then we can make up what this should be matched to.
So in our case, for the input, we want to match allow to grant and we want to match
deny to revoke.
Now, we can also set a default value down here.
So if nothing of this matches what should be the value of our newly created variable,
in our case, it should be revoked, because this is the default state that we want to
have our Facebook Pixel if the user hasn't yet replied to our cookie consent form.
Now, let's give this all a name.
And again, try this out will refresh
and reload our page.
Now,
as you have seen at the moment, we have our cookie consent status to allow and it was
rewritten from our lookup table cookie consent to the Grant command.
Let's open up our developer tools and get rid of our cookie,
reload our page.
And now our cookies shouldn't hold any value.
That's correct, it's undefined.
But our lookup table variable goes to the default value of revoke.
And obviously, if I click on decline here, reload the page,
our variable of cookie also has denied that should be transferred into revoke.
So now we can use that look up cookie consent variable inside of our Facebook Pixel.
Let's go over to our tag,
to our Facebook Pixel, and simply replace this revoke command here with our dynamic
variable, which are two curly brackets, this menu will open up and we'll choose our lookup
cookie consent.
So now, this will be automatically filled in depending on the state of the cookie.
Let's try this out,
let's save this and refresh,
reload our page.
And we can see our Facebook Pixel helper tells us that our page view was not deployed since
our variables here
are still on the revoke stage.
So let's get rid of the cookie again, open up the developer tools.
And I'm going to go to applications and under the cookies going to get rid of this one.
And reload the page.
And here we get our cookie consent form.
At this stage, our variable is still undefined.
And therefore we are on the revoke stage.
But now I'm going to click on the allow cookies.
And we would need to go to the next page view in order for it to actually show up.
Now, we should be on the second stage where we allow our cookies and therefore the page
view was fired.
So this is already it.
This is how you can connect your cookie consent form to the Facebook Pixel and programmatically
tell to send data or hold it back until this grant command has been executed.
Now, you might see a slight downside with this method that we just showed you, which
is if the user has not yet allowed the cookies, let's simulate us really quickly by going
again, into all applications.
And deleting this cookie,
the page view right here, if I click on allow cookies, although I allowed them
only the next page views would actually be triggered and sent over to Facebook.
So if you wanted to get also this page view and deploy right when somebody gives consent,
then you would need to actually build in a click trigger.
We could do this by going into our triggers here.
And let's build a click trigger.
For now, this will be a generic one.
So we'll just go with all elements here.
And the next step would be to go to our variables here and configure our building variables.
Because we want to activate our click variables right here.
You only have to do this once.
And then we'll refresh our preview and debug mode.
Go back to our page.
Now I need to get rid of the cookies.
So I'm going to open up the developer tools again, under application we have our cookies
here.
And I'm going to get rid of this consent status cookie so I can see our cookie consent again,
here we go.
And if I now click on allow cookies, I should see the GTM click right here.
And the GTM click will be filled with our variables.
So we can look at our variables and see how they distinguish each other so we can find
something unique.
We see that the click text and click classes got filled, I would go with the click classes
here.
So cc allow, it's actually a good sign.
I'm going to copy this and go over to Google Tag Manager and turn my trigger our click
trigger here into a specific one that fires on the cookie consent allow.
For that, we go back into the configurations and only fire this on some clicks where the
click classes this is correct contains cc allow.
Let's save this.
And now we need to attach this trigger to a tag.
Now, what tag should that be?
Well, simply we want to deploy our allow command, which is the line right here.
So let's build a new tag for this custom HTML tag surrounded by script tags.
And our consent here,
we rename this
and attach our trigger.
Let's refresh
and go back to our page.
Reload that.
Again, now we need to flush our cookies.
So let's go back into the developer tools applications and get rid of this cookie.
It really reloads.
All right.
And if now click on the Facebook Pixel is not sending the page view but when I click
on allow, we should have our cc allow being deployed and our Facebook Pixel firing correctly
and sending our page views over.
Now, if you have any other events that come before that they will also be halted and then
deploy it afterward once the grant command has been deployed.
We wouldn't have to do this for the disallow click as the default is that the consent is
revoked.
But now this that this is saved in the cookie anyways if you go to any new page and new
page view was generated that will be sent over to Facebook.
So this is how you can connect your Facebook Pixel with a cookie consent form.
All right, so there you have it.
This is how you can connect your cookie consent form to the Facebook Pixel.
Now notice we haven't used a negative trigger or not fired our Facebook Pixel, we actually
used the internal commands of the Facebook Pixel to prevent the data from being sent.
And then allow it if the user has given consent.
This is the method that you should use because it's actually built-in to the tool.
And Facebook takes responsibility for this command.
So it's much easier to set up and we don't need to have any kind of tracking on our side
to actually prevent that data from being sent or not.
And this is definitely something positive that GDPR has brought along.
The tool vendors are adapting, giving us these commands to actually implement this data.
Now, I'd love to hear from you.
Is that something that you will use on your page?
Do you have any more questions?
Please leave us a comment down below.
And as always subscribe to this 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 >> How to Shop for, Handle, and Store Chicken - Duration: 5:32. 
For more infomation >> Live PD: Jack Squattery (Season 2) | A&E - Duration: 4:40. 
For more infomation >> Ancient Aliens: Is Moses King Tut's Uncle? (Season 12, Episode 5) | History - Duration: 4:58. 
For more infomation >> From Puerto Rico to New York | Off Topic Episode 3 - Duration: 5:37. 
For more infomation >> Blue Island's Maple Tree Inn restaurant heavily damaged by fire - Duration: 2:24. 
For more infomation >> HECO crews responding to multiple power outages throughout Oahu - Duration: 2:16. 
For more infomation >> Tarta cebra de yogur y moras - Duration: 4:56. 
For more infomation >> First Alert Weather - Duration: 2:43. 
Không có nhận xét nào:
Đăng nhận xét