Control Third Party Data Processing
Control third-party data processing based on users' consent decisions.
This work is licensed under CC BY-SA 4.0
You must ensure that no personal data is transmitted to service providers and no cookies are set before website visitors have given consent. Since most third-party tools collect personal data by default, this requires blocking their scripts from running until visitors have provided consent via the cookie banner.
To integrate these tools in a compliant way, please follow the integration guides below. For some services, we offer specific guides to simplify implementation and pre-consent blocking. For all other tools, a general integration guide is provided.
Help us improve the Integration Guides
Consenter builds on an open and participatory development process, based on an open standard (see the Consent Standard ConStand, available at www.tinyurl.com/ConStand).*
One key area where we build on the involvement of our community is the creation and maintenance of the specific technical integration guides.
If no Technical Integration Guide yet exists for a tool you use or provide, or if you believe any of our existing guides contain inaccuracies, please help improve this documentation using the contribution buttons below or on our website.
Integration guides
For the following services, we provide step-by-step integration guides:
Custom integration
If your service is not listed above, you can integrate it manually using the Consenter API.
How it works
Once the Consenter script is loaded, you can use window.consenter.subscribe() to listen for consent changes for any service.
The Consenter API may not be available immediately when your script runs.
Always listen for the consenter:ready event on the document to know when
window.consenter is ready. If the API is already loaded, you can call it
directly. The code examples below show the recommended pattern.
function subscribeToConsenter() {
window.consenter.subscribe(
function (hasConsent) {
if (hasConsent) {
// Enable the service
} else {
// Disable the service
}
},
{ serviceId: "SERVICE_ID", purposeIds: "PURPOSE_ID" },
);
}
if (window.consenter) {
subscribeToConsenter();
} else {
document.addEventListener("consenter:ready", subscribeToConsenter);
}Parameters:
- Callback function: Runs with the current consent state right away and again
on every change —
truewhen the service is granted for the selected purpose(s),falseotherwise - Selector: Anchors the subscription to your service.
purposeIdstakes one purpose ID as a string, or several as an array — with an array the callback receives an object keyed by purpose ID instead of a boolean
subscribe returns a function that removes the subscription, and
window.consenter.has(selector) answers the same question once, synchronously.
See the JavaScript API for the full reference.
Finding your service and purpose IDs
To find the correct IDs for your integration:
- Go to Consenter Manager
- Select your website
- Click on your active banner version in the table
- You'll see the Technologies Configuration page with all your configured purposes, services, and data categories
- To find the Purpose ID: Hover over the purpose label (e.g., "Improve the website") and click the copy button in the tooltip
- To find the Service ID: Hover over the service label (e.g., "Google Analytics") and click the copy button in the tooltip
- Use both IDs in your integration code
Example
Here's a complete example showing how to integrate any service:
<script>
var serviceApiKey = "YOUR_API_KEY";
var serviceId = "YOUR_SERVICE_ID";
var purposeId = "YOUR_PURPOSE_ID";
// Initialize your service with consent requirement
// (Each service has its own initialization method)
initializeService({
apiKey: serviceApiKey,
requireConsent: true, // Prevent loading without consent
});
// Subscribe to consent changes
function subscribeToConsenter() {
window.consenter.subscribe(
function (hasConsent) {
if (hasConsent) {
// User granted consent - enable the service
enableService();
} else {
// User rejected or withdrew consent - disable the service
disableService();
removeServiceData();
}
},
{ serviceId: serviceId, purposeIds: purposeId },
);
}
if (window.consenter) {
subscribeToConsenter();
} else {
document.addEventListener("consenter:ready", subscribeToConsenter);
}
</script>Consult your service's documentation for the specific methods to enable and disable tracking or functionality.
How is this guide?
Shape Consenter Together
Consenter is built on an open and participatory process that grows through community collaboration. Whether you share feedback, improve the documentation, or contribute to the Risk Configuration Guides or Technical Integration Guides, your expertise helps make Consenter more privacy-friendly, interoperable, and useful for everyone—including your own users and services: Get finally your benefits and control the risks when sharing personal data.
Last updated on