Run Code after Cookie Consent

Background

Our cookie system categorizes cookies into four types, structured like this: ​

[
    "strictly_necessary",
    "functionality",
    "performance",
    "targeting"
]

To learn more about the different categories, please have a look at this article.

How to Run Code Only after Specific Consent is Given

To support conditional script execution, we’ve introduced two tools:

• window.umsoCookieConsent — a global variable containing the visitor's current consent status and categories.

• umsoCookieConsentGranted — a custom event triggered whenever a user saves or updates their consent preferences.

These allow you to conditionally execute logic depending on the visitor’s choices.

Event / Global Variable Structure

The umsoCookieConsentGranted event has the following structure: ​

{
  "detail": { 
    "categories": [
      "strictly_necessary",
      "functionality",
      "performance",
      "targeting"
    ]
  }
}

The global variable window.umsoCookieConsent has the following structure: ​

{ 
  "categories": [
    "strictly_necessary",
    "functionality",
    "performance",
    "targeting"
  ]
}

Best Practices

To ensure your scripts always reflect the most up-to-date consent state:

• Use the window.umsoCookieConsent variable to access the current status.

• Also listen for the umsoCookieConsentGranted event to respond to updates in real time.

This approach ensures that any scripts you run, such as tracking, analytics, or personalization, respect the user's preferences from their first visit onward.

Example: Microsoft Clarity Integration

If you use Microsoft Clarity and want to ensure it only runs when the visitor consents to performance cookies, follow these steps:

1. Include Clarity’s default tracking script in your header or tag manager.

2. Add the following script to conditionally enable or disable Clarity:

<script>
  // reusable function to handle consent 
  function handleClarityConsent(categories) {
    const clarityLoaded = typeof window.clarity === 'function';
    if (!clarityLoaded) {
      return;
    }

    if (Array.isArray(categories) && categories.includes('performance')) {
      window.clarity('consent');
    } else {
      window.clarity('consent', false);
    }
  }

  // run this code when your clarity script has been loaded 
  // to read any existing content responses
  const initialConsent = window.umsoCookieConsent;
  if (initialConsent && Array.isArray(initialConsent.categories)) {
    handleClarityConsent(initialConsent.categories);
  }

  // once you have initialized clarity, you'll want to add this code
  // to listen for future consent changes
  window.addEventListener('umsoCookieConsentGranted', e => {
    handleClarityConsent(e.detail.categories);
  });
</script>