Contextual Consent

If you embed third-party content—such as maps, videos, or social media features—on your website, you must ensure that these providers do not collect personal data from visitors before consent has been obtained. To achieve this, you should implement our contextual consent solution when integrating such content.

Our contextual consent mechanism:

1. Blocks third-party content until the user has given consent.
2. Allows users to provide consent directly within the embedded content, thereby unblocking it.
3. Automatically unblocks content for users who have already consented to the purpose “Unlock additional website features.”

To implement contextual consent for any third-party provider (TPP), follow the steps below.

Select the correct contextual consent type
Copy-paste the respective code snippet
Replace TPP-specific placeholders

Some third-party integrations process personal data solely to provide their service, while others also use data for their own additional purposes (e.g. advertising). This means you’ll need to collect different consents depending on the specific third-party provider you want to embed on your website.

Shown below are the three scenarios for embedding third party content and guidance on which type of contextual consent to implement (type 1 and type 2).

Technical integration

Contextual consent only works if your Consenter Banner is configured correctly in the Consenter Manager. Make sure the

purposes used by the third-party provider match the purposes enabled in your banner

. If the purposes do not match, contextual consent cannot be applied.

Add the contextual consent scripts

Place the contextual consent script at the top of the <head> section:

index.html

<!-- Integrate Consenter contextual consent -->
<!-- Paste the contextual consent script inside the <head> section -->
<script src="https://banner.consenter.eu/contextual-consent.js"></script>
<script src="https://banner.consenter.eu/YOUR_DOMAIN_ID/cb.js" async></script>

Add Consenter attributes to your embed

Remove the original src attribute, and add Consenter data attributes inside of the <iframe> where you want to enable contextual consent. Put the URL that should load after consent into data-consenter-content-url, then replace the placeholders with your own values:

For type 1 (simple unblock)

iframe

<!-- Enable Consenter contextual consent for a service -->
<iframe
  width="560"
  height="315"
  data-consenter-language="DE"
  data-consenter-tpp-id="YOUR_SERVICE_ID"
  data-consenter-tpp-label="YOUR-SERVICE-NAME"
  data-consenter-content-label="YOUR-CONTENT-DESCRIPTION"
  data-consenter-content-url="YOUR_SERVICE_URL"
>
  ...
</iframe>

For type 2 (additional purposes)

Add the required purpose flags:

When using contextual consent, you can choose from the following additional purposes:

Improve the service

Support marketing analytics

Customise online ads

Find out which purposes to select for your TPP in our TPP configuration guides or the privacy policy and documentation of the respective TPP.

iframe with additional purposes

<!-- Enable Consenter contextual consent for a service -->
<iframe
  width="560"
  height="315"
  data-consenter-language="DE"
  data-consenter-tpp-id="YOUR_SERVICE_ID"
  data-consenter-tpp-label="YOUR-SERVICE-NAME"
  data-consenter-content-label="YOUR-CONTENT-DESCRIPTION"
  data-consenter-content-url="YOUR_SERVICE_URL"
  data-consenter-tpp-purpose-improve-the-service="true"
  data-consenter-tpp-purpose-marketing-analytics="true"
  data-consenter-tpp-purpose-customise-ads="true"
>
  ...
</iframe>

What each attribute does (quick reference)?

Attribute	What it does	Where to find it?
`data-consenter-tpp-id`	Tells Consenter which TPP this embed belongs to.	Always required. Find the TPP/service ID in Consenter Manager → Your Site → Active Banner → Hover over the service and click the copy button in the tooltip.
`data-consenter-tpp-label`	Display name shown to the user (e.g., “YouTube video”).	Required. Use something users immediately understand.
`data-consenter-content-url`	The URL that loads after the user unblocks / consents.	Required. Usually the original iframe/embed `src`. Remove the original `src` attribute so the content is blocked before consent.
`data-consenter-content-label`	Short description of the specific content (e.g., “Product Demo”).	Required. Helps users understand what they are enabling.
`data-consenter-language`	Sets the language of the contextual consent UI.	Optional. Supports `EN` and `DE`. If missing, the browser language is used when it is English; otherwise German is used.
`data-consenter-tpp-purpose-improve-the-service`	Declares that the service uses data for Improve the service.	Required only if the TPP needs this purpose legally. Set to `true`.
`data-consenter-tpp-purpose-marketing-analytics`	Declares that the service uses data for Support marketing analytics.	Required only if the TPP needs this purpose legally. Set to `true`.
`data-consenter-tpp-purpose-customise-ads`	Declares that the service uses data for Customised online ads.	Required only if the TPP needs this purpose legally. Set to `true`.

If unsure whether your TPP requires contextual consent of type 1 or type 2, check out our TPP configuration guides or refer to the privacy policy or documentation of the TPP.

Contextual consent types

Scenario 1: No-consent required

Scenario 2: Contextual consent with simple unblock button (type 1)

Scenario 3: Contextual consent for additional purposes (type 2)

Technical integration

On this page