- Alternatives for GTM
- Section 1: Understanding GTM's Built-in Consent Management Model
- Section 2: Creating a Custom Consent Manager Pop-up
- Section 3: Handling Consent Acceptance with GTM's Built-in Consent Model
- Section 4: Configuring GTM to Fire Tags Based on Consent
- Conclusion:
With the evolution of privacy regulations, website owners must implement a consent management solution that respects user privacy and complies with these regulations. Google Tag Manager (GTM) provides a built-in consent management model that allows you to control when and how tags are fired based on user consent. In this article, we will cover how to implement consent management in GTM using its built-in consent model, including code examples for creating a custom consent manager pop-up.
Alternatives for GTM
GTM is without a doubt the market leader in tag management systems, but there are alternatives. One such alternative is Cloudflare Zaraz, which focuses on speed by offloading much of the processing by third-party tags to Cloudflare's Worker network. For a comprehensive guide on the differences between Zaraz and GTM check out our article Cloudflare Zaraz vs Google Tag Manager (GTM).
Section 1: Understanding GTM's Built-in Consent Management Model
GTM's built-in consent management model enables you to configure tags to fire only when specific consent conditions are met, ensuring compliance with privacy regulations such as GDPR and CCPA. GTM supports the following consent types:
-
ad_storage: Used for advertising personalization features -
analytics_storage: Used for measurement features
Section 2: Creating a Custom Consent Manager Pop-up
To create a custom consent manager pop-up, you can use HTML, CSS, and JavaScript. Here's a simple example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Consent Manager Pop-up</title>
<style>
/* Add your custom CSS styles for the pop-up */
</style>
</head>
<body>
<div id="consent-popup" style="display:none;">
<p>We use cookies to improve your experience on our website. Please confirm your consent.</p>
<button id="accept">Accept</button>
<button id="decline">Decline</button>
</div>
<script>
// Add your custom JavaScript code for handling the pop-up
</script>
</body>
</html>
Section 3: Handling Consent Acceptance with GTM's Built-in Consent Model
To handle consent acceptance using GTM's built-in consent model, you can use JavaScript and GTM's data layer:
document.getElementById("accept").addEventListener("click", function() {
// Save consent to localStorage or cookies
localStorage.setItem("ad_storage", true);
localStorage.setItem("analytics_storage", true);
// Push the consent status to GTM's data layer
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
'event': 'consent_change',
'ad_storage': 'granted',
'analytics_storage': 'granted'
});
// Hide the consent pop-up
document.getElementById("consent-popup").style.display = "none";
});
// Check for existing consent
if (localStorage.getItem("ad_storage") === "true" && localStorage.getItem("analytics_storage") === "true") {
// Consent already given, hide the consent pop-up
document.getElementById("consent-popup").style.display = "none";
} else {
// Consent not given, show the consent pop-up
document.getElementById("consent-popup").style.display = "block";
}
Section 4: Configuring GTM to Fire Tags Based on Consent
Now that you have your custom consent manager pop-up and JavaScript code in place, you need to configure GTM to fire tags based on the consent given. Follow these steps:
- In GTM, go to "Tags" and select the tags you want to fire based on consent.
- Edit each tag and set the triggering condition to fire based on the consent given. To do this, you will need to create and configure custom triggers for each consent type:
a. Go to "Triggers" and create a new custom event trigger. Name it "Ad Storage Consent Granted" and set the event name to "consent_change". b. Under "This trigger fires on," choose "Some Custom Events" and set the condition to "ad_storage equals granted." c. Similarly, create another custom event trigger named "Analytics Storage Consent Granted" with the event name "consent_change" and set the condition to "analytics_storage equals granted."
- For each tag, set the triggering condition based on the consent type it falls under:
a. For tags related to advertising personalization, set the triggering condition to the "Ad Storage Consent Granted" trigger you created earlier. b. For tags related to measurement, set the triggering condition to the "Analytics Storage Consent Granted" trigger.
With these configurations in place, GTM will fire the appropriate tags only when the corresponding consent type is granted by the user.
Conclusion:
Implementing consent management in Google Tag Manager using its built-in consent model ensures compliance with privacy regulations and respects user privacy. By creating a custom consent manager pop-up and configuring GTM to fire tags based on consent, you can provide a better user experience and adhere to privacy regulations like GDPR and CCPA. Always stay updated on the latest privacy regulations and adjust your consent management solution accordingly to maintain compliance.
Related articles
