How To Setup A Consent Banner | GTM, GA4, & Google Ads

hey there I'm Benjamin from loves data in this video I'm going to show you how to set up consent mode in Google tag manager so that tags including your Google analytics tags are triggered based on the selection people make on your website's consent [Music] Banner apart from controlling when tags fire on your website consent mode automatically works with a number of Google tags for example consent mode automatically adjusts how the tag behaves if you send data to Google analytics if someone hasn't provided consent then a cookist ping will be collected then when consent is provided all of the available data is collected okay let's jump in and head to Google tag manager we're going to start by adding the consent overview to our container this summarizes tags that do and don't use consent mode to enable this let's select admin then container settings let's enable the consent overview option and click save now let's navigate to tags we can now see the consent icon above our tags let's select this this shows us all of the tags in our container we can see all of our tags are listed under consent not configured this tells us that we haven't configured consent mode for our tags yet at the bottom you'll also find a section called consent configured when consent mode is defined for a tag they'll be listed in this section let's close the overview in this tutorial I'm going to show you how to set up consent mode with termly which is a consent management platform using a consent management platform includes some additional benefits for example termly includes support consent logs Geographic targeting of your consent banner and more if you would prefer a free solution I've included a link to an open-source solution in the description below this video and I've also included links to other consent management platforms too okay let's head to term l I've already created an account and scanned my website to check which cookies are currently being used and I've also included a link to termly in the description below this video now let's select consent management and choose consent Banner we can now customize our consent Banner but I'm going to leave the defaults and let's scroll down to consent settings there are options to control the consent Banner for different Geographic locations but for this tutorial I'm going to use the global settings the most important thing we need to do is ensure that enable consent Banner is set to no this allows us to get everything configured before we add the banner to our website then we'll come back and enable the banner when we're ready and we also need to ensure that Google consent mode is set to on this will automatically pass the consent selections people make to Google tag manager so we can control how our tags behave including when they fire now let's scroll to the bottom and click save now let's scroll to the top and select install on the top right corner now let's select embed to the right of step two embed consent Banner we can see there are a range of options to choose from and while there is an option to add the consent Banner using Google tag manager this isn't the recommended method to use it's not the recommended method because if you add termly to your website using Google tag manager it might not be the first thing to load which can cause problems this doesn't mean you can't use Google tag manager to manage other tags it just means we shouldn't use Google tag man to add the termly code to our website so I recommend selecting plain HTML or selecting the platform you're using for your website whichever option you choose there are two important things to check first you need to ensure that the autol blocker feature is disabled and you need to install the termly code before your Google tag manager container code on your website okay so today I'm using Wordpress so let's select this option termly recommends using their plug-in to install the code so let's copy the API key and let's head to Wordpress I've already added Google tag manager to Wordpress using the GTM for WordPress plugin if you would like to learn more about implementing GTM on your website then I recommend watching my dedicated GTM tutorial series I've included a link in the extra resources below this video now let's select plugins and add new plug-in let's search for termly and let's click install now and let's click activate now let's select termly paste the API key we copied earlier and click save now let's select Banner settings we need to ensure the auto blocker is disabled this needs to be disabled because we'll be controlling the firing of our tags in Google tag manager I'm also going to enable the consent Banner this means the consent Banner has now been added to our website the next step is configuring consent mode settings in Google tag manager let's head to Google tag manager to make things quicker and easier I've created a preconfigured template you can import into Google tag manager this includes everything you need need to get up and running I've included a link to this in the description below this video to import the container let's navigate to admin and let's choose import container let's choose the preconfigured template and select existing and choose the default workspace now I'm going to select merge and I'm going to import the container we've now imported the preconfigured container so let's take a look at what this has added for us let's start by navigating to triggers we can see there are two termly triggers there's one trigger for when people save their consent preference this this is for when people make a selection on the consent banner and there is another trigger for when people update their preferences this is for when people adjust their consent preferences now let's navigate to tags we can see there is a new termly tag let's open the tag this uses term's tag template it updates consent based on the selections people make and we can see there are two triggers added to the tag this ensures the tag fires on all of the pages of our website and when someone updates their consent preferences okay let's close this the next thing we need to do is check all of our other tags this is where you control if tags are fired or not fired based on the consent preferences people have selected there are also some t tags like the tags we use for Google analytics and Google ads that have built-in consent checks this means they automatically adjust based on people's consent preferences apart from the termly tag we just added we can see this container has four other tags there's a tag for cloud flare analytics a conversion Linker tag for Google ads a Google ads remarketing tag and a Google tag sending data to ga4 Google analytics 4 to check your tags I recommend using the consent overview that we enabled earlier so let's click the consent overview icon on the top right of the interface we need to check the consent settings for all of the tags listed under consent not configured at the top let's start by selecting the termly tag since this tag is used to manage consent we need it to fire every time someone visit visits our website so let's select advanced settings and then consent settings now we need to select no additional consent required and let's save the tag now let's select the Google ads conversion Linker tag let's select advanced settings and then consent settings we can see this tag has add storage add personalization and add user data listed under built-in consent checks this means the tag will automatically adjust based on people's consent preferences so if someone hasn't provided consent yet it will send some basic information to Google ads without creating any cookies on their browser because the tag has built-in consent checks we can select no additional consent required for this tag and we don't need to do anything else to configure this tag so let's save the tag now let's select the Google ads remarketing tag let's select advanced settings and then consent settings again we can see there are built-in consent checks so let's select no additional consent required and let's save the tag next let's open the Google analytics tag and select advanced settings and consent settings again there are built-in consent checks for this tag so let's select no additional consent required and let's save the tag now let's open the cloud flare analytics tag at the top we can see this is a custom HTML tag so this means we will need to decide how this tag will Fire based on people's consent selection so let's select advanced settings and then consent settings since there is no built-in consent checks and this tag is used to collect analytics data let's select require additional consent for tag to Fire and let's click add required consent now we need to select analytic storage termly recommends that we also adjust any tags that are triggered when Pages load on our website so under tag firing options let's select once per page this prevents the tag from firing multiple times if people change their consent preference now let's select triggering we need to remove the initialization all pages trigger and add the termly consent save trigger now let's save the tag all of the tags are now listed under consent configured so let's close the consent overview now let's head to term and we need to enable our consent Banner so let's set enable consent Banner to yes and let's scroll to the bottom and click save now let's head back to Google tag manager and click [Music] preview we need to enter the URL for our website and click connect our website loads and we can see our consent banner before we make a selection let's open the tag assistant tab we can see the termly tag has fired along with the Google ads tag and the Google analytics tag we can also see the cloud flare tag hasn't fired yet because we haven't provided consent yet let's select the Google analytics measurement ID at the top and let's select the page view event we can see the cookie consent State parameter has a value of g100 this means that consent hasn't been granted yet it also means the tag has collected some basic details without storing any cookies in our browser let's head back to the website and let's click accept on the consent Banner now let's navigate to another page and let's open the tag assistant tab again let's open the new page view event we can now see the cookie consent State parameter has a value of G11 which means cookies are now being stored and all of the information available is being sent to Google analytics let's head back to Google tag manager and let's click submit to publish our container let's name the version and click publish we're now using the termly consent Banner on our website to control when our tags fire we're also using the built-in consent checks for the tag sending data to Google analytics and Google ads once you've implemented a consent Banner on your website remember to check the consent settings for each of your tags you'll also need to configure the consent settings for any tags you add in the future have you added a consent Banner to your website or are you going to I'd love to know let me know in the comments below and to stay up to dat and learn even more about Google tag manager and Google analytics please take a moment to subscribe to this channel thanks for watching and I'll see you in the next video

Channel: Loves Data

Views: 17,320

Keywords:

Id: zWftt3gGhEA

Length: 16min 40sec (1000 seconds)

Published: Tue Feb 27 2024