How can I block iframes using the Usercentrics API?

To block iframes, you can either use our Smart Data Protector or build your own solution with our API. Here’s a suggestion on how to do that.

To block iframes, you can either use our Smart Data Protector or build your own solution with our API. Here’s a suggestion on how to do that.

For blocking iframes of many technologies (e.g. Youtube Video, Google Maps etc.) we provide an out of the box solution - the so-called Smart Data Protector. All information regarding the implementation and the supported technologies of the Smart Data Protector can be found in our technical documentation.

Note: While we give support for our API, the actual implementation needs to happen on your end as it always depends on your specific web presence.

The Steps

Use an event listener to build a wrapper, allowing you to also react to consent changes done by the user after the initialisation of the CMP. In the event listener, check for the consent of the service that the iframe belongs to. Information on event listeners in the Usercentrics CMP can be found in our technical documentation (CMP V2 | CMP V1). For checking the consent of a specific service we recommend using our API (see CMP V2 | CMP V1).
If desired create a visual overlay on your website for a specific DPS (e.g. Google Maps). This overlay should hold the information that will be shown to visitors who have not yet given their consent for this DPS. Buttons on this overlay can give the users the possibility to open the privacy settings for reviewing / changing his consent or to agree directly to the service (see API for CMP V2 | CMP V1).

Note: In CMP V2 you can directly open the privacy settings of a specific service by adding its template-ID to the global method: UC_UI.showSecondLayer(“Template-ID”)

3. If consent was given, replace the overlay with the actual iframe you want to show on your website. For example, this can be done by programmatically creating the iframe and appending it to the overlay you created (e.g. using appendChild() ).

4. If the user changes their consent you can use the event listener to remove the iframe again (e.g. using removeChild() ) and reshow the overlay.

Do you need further help?

How can I get help with questions on the Usercentrics CMP?