Direct Implementation

The Usercentrics Consent Management Platform (CMP) can be directly integrated on the Website and then Scripts will be only executed in case the Users provide their Consents.

To execute the Scripts after the Users have given their Consent, there is need to integrate the Usercentrics Script on the Website.

Implement the Usercentrics-Script in the head area

You can find your personal script with the Setting ID in the Settings Dashboard under “General”.

Except for the Setting ID, the Script looks like -

<script type="application/javascript" src="https://app.usercentrics.eu/latest/main.js" id="XXXXXXXXX"></script>

Copy your Script from the Settings Dashboard or replace "XXXXXXXXX" with Personal Specific ID in the above example.

This Code needs to be implemented in the head section of the Website, so that our Consent Management Platform is triggered on the Website.

Please note - Make sure that the correct Domain is stored in your settings (“General” → “Domain”). Once this is ensured, the Usercentrics script can be executed on the Website.

Adjust Existing Scripts

Once the Usercentrics Script is integrated on the Website, all existing scripts need to be customized. This Step is required so that all scripts are executed only after the explicit permission of the visitors.

Change script type – “text / javascript” to “text / plain”

To Customize your Scripts, there are two small changes required. Firstly, Change the Script type. Change the Type from type="text/javascript" to type="text/plain" in your scripts.

Even if the Script does not explicitly specified as type="text/javascript", in this scenario it can be interpreted by the browser without naming it, so there is need to adjust it to type="text/plain".

The changes are required so that the script is not automatically interpreted and executed by the browser when the page is called.

Assign Data-Attributes

To connect to the Consent Management Platform and to query consent status on a script-based basis, the scripts will require a custom Data Attribute.

This data attribute is constructed according to the principle data-usercentrics="Name Data Processing Service", where “Name Data Processing Service” corresponds to the exact name of the Data Processing Services that is created in the Settings dashboard under “Data Processing Services“.

Please note that Capital, lower case letters as well as Spaces should be considered.

Below given is the example from Google Analytics Script :-

Original:

<script async="" src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXX-X"></script>
<script>

  window.dataLayer = window.dataLayer || ;
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-XXXXXXXX-X');
</script>

becomes

Customized Version:

<script type="text/plain" data-usercentrics="Google Analytics" async="" src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXX-X"></script>
<script type="text/plain" data-usercentrics="Google Analytics">

  window.dataLayer = window.dataLayer || ;
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-XXXXXXXX-X');
</script>

Now the Google Analytics script will only be executed if the visitor has consented to the “Google Analytics” Consent with the same name.

Do you need further help?

https://usercentrics.atlassian.net/wiki/spaces/SKB/pages/234913848