Shopify and the OneTrust Script

Last Updated: Oct 26, 2021

If you use Shopify to manage your website, you can add the script to your theme header, along with the scripts for tag managers your organization uses.

Integration Steps

  1. Open your Shopify account.

  2. On the main navigation menu, select Online Store > Themes.

Shopify Themes

  1. On your current theme, hover over the Actions button. Then select Edit code. The code editor appears.

  2. Under Layout, select theme.liquid.

  3. In the <head> section of the code, paste the script.

For the integration to work, you must have a published script. For information on how to publish a script, see Getting Started with Cookie Compliance.

Theme Liquid

  1. Click the Save button.

Blocking Shopify Server-side Cookies

Below is an example of how you can use the OneTrust OptanonWrapper() callback to pass through consent values to Shopify Privacy API. For more information, see Using the OptanonWrapper Callback Function.

You can rename the performanceCookieCategory variable and change the value based on cookie category IDs. When renaming, make sure the value is updated based on the consent you want to associate with the Shopify API.

If you rename the performanceCookieCategory variable, you must rename the variable anywhere it's referenced.

<script>

const performanceCookieCategory = 'C0002,';

function waitForOneTrust() {
  hasOneTrustLoaded();
  let attempts = 0;
  const interval = setInterval(function () {
    if (hasOneTrustLoaded() || attempts > 100){
      clearInterval(interval);
    } 
    attempts++;
  }, 100)
}

function hasOneTrustLoaded() {
  if (typeof window.OnetrustActiveGroups === 'string') {
    //check now
    optanonWrapper()
    // and wrap and trigger after cookie opt-in
    window.OptanonWrapper = optanonWrapper;
    return true;
  }
  return false;
}

function sendConsent(trackingConsent) {
  window.Shopify.customerPrivacy.setTrackingConsent(trackingConsent, () => {
    console.log('Happy Days')
  });
}

function optanonWrapper() {
  const trackingConsent = !!window.OnetrustActiveGroups.includes(performanceCookieCategory);       window.Shopify.loadFeatures(
    [
      {
        name: 'consent-tracking-api',
        version: '0.1',
      },
    ],
    error => {
      if (error) {
        throw error; 
      }
      sendConsent(trackingConsent)
    },
  );   
}

(function () {
  waitForOneTrust();
})();

</script>