Manually add Clarity Consent Mode

You’re not using the Complianz wizard to add Clarity, and you’re not using the Clarity WordPress plugin? Continue with below snippet, which you can add to your website yourself. Otherwise — https://complianz.io/microsoft-consent-mode/

Make sure to add your project ID, and replace the clarity script you’re currently using:

/**
 * Microsoft Clarity integration with Complianz
 * Implements Clarity Consent API v2 for GDPR compliance
 */

/**
 * Safely call Clarity API with error handling
 * @param {string} method - Clarity API method name
 * @param {*} params - Parameters to pass to the method
 */
function callClarity(method, params) {
    if (typeof window.clarity === 'function') {
       try {
          window.clarity(method, params);
       } catch (e) {
          console.warn('Clarity API error:', e);
       }
    }
}


/**
 * Injects the Microsoft Clarity tag and initializes a queued `clarity` function.
 *
 * Ensures `window.clarity` is a function that queues calls until the external Clarity
 * script loads, then inserts the Clarity script asynchronously.
 *
 * Usage: replace `{site_ID}` with your Clarity project id (for example `abcd1234`).
 *
 * @param {Window} c - Global window object.
 * @param {Document} l - Document object.
 * @param {string} a - Global name to assign the queueing function (usually "clarity").
 * @param {string} r - Element tag to create (usually "script").
 * @param {string} i - Clarity site/tag id to append to the script src.
 * @param {*} t - Internal temporary variable for the created element.
 * @param {*} y - Internal temporary variable for the reference node to insert before.
 */
(function (c, l, a, r, i, t, y) {
    c[a] = c[a] || function () { (c[a].q = c[a].q || []).push(arguments); };
    t = l.createElement(r);
    t.async = 1;
    t.src = "https://www.clarity.ms/tag/" + i;
    y = l.getElementsByTagName(r)[0];
    y.parentNode.insertBefore(t, y);
})(window, document, "clarity", "script", "{site_ID}");


/**
 * Sends an initial consent status to Clarity using Consent API v2.
 * This sets both `ad_Storage` and `analytics_Storage` to "denied" by default.
 *
 * This is typically called before any user interaction to ensure that no
 * tracking occurs until explicit consent is granted.
 */
callClarity('consentv2', {
    ad_Storage: "denied",
    analytics_Storage: "denied"
});

/**
 * Extract consent status from Complianz event
 * @param {Event} e - Complianz event object
 * @returns {Object} Object with analyticsAllowed and adsAllowed properties
 */
function getConsentFromEvent(e) {
    var d = e && e.detail && e.detail.categories ? e.detail.categories : {};
    return {
       analyticsAllowed: !!d.statistics,
       adsAllowed: !!d.marketing
    };
}

/**
 * Send consent status to Clarity using Consent API v2
 * @param {boolean} analyticsAllowed - Whether analytics/statistics consent is granted
 * @param {boolean} adsAllowed - Whether advertising/marketing consent is granted
 */
function sendClarityConsent(analyticsAllowed, adsAllowed) {
    var status = function (b) { return b ? "granted" : "denied"; };
    // Consent API v2: pass analytics/ad storage status.
    callClarity('consentv2', {
       analytics_Storage: status(!!analyticsAllowed),
       ad_Storage: status(!!adsAllowed)
    });
}

/**
 * Erase Clarity cookies (called when all consent is revoked)
 * Uses Consent API v1 for cookie erasure
 */
function eraseClarityCookies() {
    callClarity('consent', false);
}

/**
 * Handle consent granted/updated event from Complianz
 * Fired when user accepts categories or updates preferences
 */
document.addEventListener('cmplz_fire_categories', function (e) {
    var consent = getConsentFromEvent(e);
    sendClarityConsent(consent.analyticsAllowed, consent.adsAllowed);
});

/**
 * Handle consent revoked event from Complianz
 * Fired when user revokes previously granted consent
 */
document.addEventListener('cmplz_revoke', function (e) {
    var consent = getConsentFromEvent(e);
    sendClarityConsent(consent.analyticsAllowed, consent.adsAllowed);
    if (!consent.analyticsAllowed && !consent.adsAllowed) {
       eraseClarityCookies();
    }
});

You don’t want all the comments inline?

Use this snippet: