Set up OneTrust for cookie consent

Every Foleon Doc has cookies, and according to the GDPR, you need to inform your readers about these cookies. Your company might use OneTrust as a Consent Management Platform (CMP) to meet additional requirements for your cookie consent. This article shows you how to implement OneTrust into your Foleon Docs.

How OneTrust and Foleon work together

The role of a Consent Management Platform (CMP) such as OneTrust is to ask for consent, give a signal once cookie preferences are given, and store the cookie preferences in the browser as a cookie.

Websites or Foleon Docs need to look for those preferences, listen for that signal that the cookie preferences have been set, and then act accordingly by executing the scripts that are allowed to be executed.

If you want to implement OneTrust into your Foleon Docs, you'll need to build your custom script.

Build your custom script

• Script 1: Prevent Foleon from placing cookies

  Certain cookies are placed by Foleon once the Doc is loaded. For example, cookies related to:

  • Foleon Analytics

  • Google Analytics

  • Custom scripts you've placed in the remarketing field.

    <script>
      if (!window.localStorage.getItem("cc_settings")) {
        window.localStorage.setItem(
          "cc_settings",
          JSON.stringify({ statistics: 0, marketing: 0, preferences: 1 })
        );
      }
    </script>

• Script 2: OneTrust banner

  To get the OneTrustbanner to work, we need to add another script.
  
  You'll get the second script from OneTrust, which should look something like this: 

  <!-- Add your OneTrust Cookies Consent SDK script here, or replace the values with the ones from your application -->
  <script
    src="https://cdn.cookielaw.org/scripttemplates/otSDKStub.js"
    type="text/javascript"
    charset="UTF-8"
    data-domain-script="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"
  ></script>

• Script 3: Consent changes

  The third script listens to any consent changes and updates the Foleon consent manager accordingly. This ensures that the correct cookies are placed.

  <!-- mapping the OT cookie categories to Foleon cookie categories-->
  <script type="text/javascript">
    function OptanonWrapper() {
  ​
      //OneTrust Cookies On Consent Listener to update the Foleon Cookie consent manager  
      OneTrust.OnConsentChanged(function(e) {
  
          const statistics = e.detail.includes('C0003') ? 1 : 0
          // when marketing and social media cookies are accepted, we enable the Foleon marketing cookie
          const combinedMarketingCookies = ["C0004", "C0005"] 
          const marketing = combinedMarketingCookies.every(value => {
              return e.detail.includes(value);
          }) ? 1: 0;
          // when both functional and preferences cookies are accepted, we enable the Foleon preferences cookie.
          const combinedPreferenceCookies = ["C0001", "C0002"] 
          const preferences = combinedPreferenceCookies.every(value => {
              return e.detail.includes(value);
          }) ? 1: 0;
  ​
          // Updating the Foleon Consent Manager.
          // set default values when the API is not yet available
          if(typeof CookieConsentAPI !== 'undefined') {
  ​
              CookieConsentAPI.update({
              statistics: statistics || 0,
              marketing: marketing || 0,
              preferences: preferences || 1
  ​
              })
  ​
              CookieConsentAPI.save()
  ​
              } else {
              // save new values after (updated) consent
              localStorage.setItem("cc_settings", JSON.stringify({
              statistics: statistics || 0,
              marketing: marketing || 0,
              preferences: preferences || 1
              }))
              }
      })
    }
  </script>

• Example of a complete script

  With the three scripts we've shared above, we assembled an example of a complete script.

  In the example below, replace the second script with your own OneTrust script. That's it, you've now built the complete script. Read on to learn how to inject this script into the remarketing field.

  ⚠️ Any custom script you implement is the creator's responsibility, so ensure you know your script inside out. If you're not very experienced, we recommend you consult an expert in Javascript and cookie consent.

  <script>
  if (!window.localStorage.getItem('cc_settings')) {
  window.localStorage.setItem('cc_settings', 
  JSON.stringify({"statistics":0, "marketing": 0, "preferences": 1}));
  }
  </script>
  <!-- Add your OneTrust Cookies Consent SDK script here, or replace the values with the ones from your application -->
  <script
  src="https://cdn.cookielaw.org/scripttemplates/otSDKStub.js"
  type="text/javascript"
  charset="UTF-8"
  data-domain-script="XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX"
  ></script>
  ​
  <!-- mapping the OT cookie categories to Foleon cookie categories-->
  <script type="text/javascript">
  function OptanonWrapper() {
  ​
  //OneTrust Cookies On Consent Listener to update the Foleon Cookie consent manager 
  OneTrust.OnConsentChanged(function(e) {
  
  const statistics = e.detail.includes('C0003') ? 1 : 0
  // when marketing and social media cookies are accepted, we enable the Foleon marketing cookie
  const combinedMarketingCookies = ["C0004", "C0005"] 
  const marketing = combinedMarketingCookies.every(value => {
  return e.detail.includes(value);
  }) ? 1: 0;
  // when both functional and preferences cookies are accepted, we enable the Foleon preferences cookie.
  const combinedPreferenceCookies = ["C0001", "C0002"] 
  const preferences = combinedPreferenceCookies.every(value => {
  return e.detail.includes(value);
  }) ? 1: 0;
  ​
  // Updating the Foleon Consent Manager.
  // set default values when the API is not yet available
  if(typeof CookieConsentAPI !== 'undefined') {
  ​
  CookieConsentAPI.update({
  statistics: statistics || 0,
  marketing: marketing || 0,
  preferences: preferences || 1
  ​
  })
  ​
  CookieConsentAPI.save()
  ​
  } else {
  // save new values after (updated) consent
  localStorage.setItem("cc_settings", JSON.stringify({
  statistics: statistics || 0,
  marketing: marketing || 0,
  preferences: preferences || 1
  ​
  }))
  ​
  }
  ​
  })
  
  }
  </script>

Place your script in the remarketing field

We're almost there. We’ve prevented scripts from being executed without consent and built the script, so now we're ready to inject the OneTrust script into the remarketing field.

Once you've correctly configured your custom script, add your custom code in the Foleon Doc settings of your Doc when you scroll down to the Marketing tab.

On the right side, copy-paste the script into the Remarketing code field. Save your changes and (re)publish your Foleon Doc.