Want Microsoft Clarity to collect heatmap and session recording data without cookies until visitors consent? WPConsent integrates with Clarity Consent Mode to let Clarity run in a cookieless state and only enable full tracking after consent is given. Microsoft Clarity Consent Mode gives you behavioral analytics while respecting visitor privacy choices.

Table of contents

• Prerequisites
• Understanding how it works
• Enabling Clarity Consent Mode
• Confirming a Clarity service exists
• Understanding the relationship with script blocking
• Verifying your setup
• Troubleshooting
• FAQ
• Conclusion

Prerequisites

Before you begin, make sure you have:

• WPConsent installed and activated
• The consent banner enabled in WPConsent >> Settings
• The Clarity tracking script installed on your site (through a plugin like WPCode, your theme, or manually in your header)
• At least 1 service with clarity in its slug in your cookie database. Run a scan if you haven’t already

Understanding how it works

Clarity Consent Mode works differently from Google Consent Mode v2. Unlike Google Consent Mode, there’s no way to set a default denied state for Clarity at page load. Clarity automatically runs in cookieless mode for visitors from the European Union, but it still uses cookies for visitors from other regions by default.

If you want full control over cookies for all visitors regardless of their location, you need to disable cookies in your Microsoft Clarity dashboard settings. This ensures Clarity runs in cookieless mode globally and only enables cookies after WPConsent communicates consent.

When a visitor interacts with your banner, WPConsent fires window.clarity('consentv2', {...}) with the consent status. This happens every time a visitor saves preferences, whether through the accept button, the deny button, or the preferences modal.

WPConsent maps your cookie categories to Clarity’s consent parameters:

WPConsent cookie category	Clarity consent parameter	Accepted value	Denied value
marketing	ad_Storage	granted	denied
statistics	analytics_Storage	granted	denied

Enabling Clarity Consent Mode

Clarity Consent Mode is enabled by default. To verify or change this setting, navigate to WPConsent >> Settings and select the Advanced tab.

Next, find the Clarity Consent Mode toggle. The description reads “Use Microsoft Clarity without cookies until consent is given.”

The toggle is on by default. If it was previously disabled, turn it on and click Save Changes at the bottom of the page.

Clarity Consent Mode requires the consent banner to be enabled. If the banner is disabled, the consent signals won’t be sent to Clarity.

Confirming a Clarity service exists

WPConsent only sends consent signals to Clarity if at least 1 service in your cookie database has clarity in its slug.

To check, go to WPConsent >> Settings and select the Cookies tab. Look for a Clarity service in your list.

If you ran the site scanner, Clarity is likely already detected. If it isn’t in the list, create a new service and set the slug to clarity. Assign it to the statistics category.

Understanding the relationship with script blocking

When Clarity Consent Mode is enabled, WPConsent automatically skips script blocking for Clarity. This is intentional.

Clarity Consent Mode allows the Clarity script to load immediately in a cookieless state. Instead of blocking it entirely, WPConsent uses Clarity’s own consent API to control what data it collects. The script runs without cookies until consent is granted.

You don’t need to configure anything for this behavior. It happens automatically as long as:

• The Clarity Consent Mode toggle is enabled
• The service name recognized by the script blocker is clarity

Other non-Clarity scripts continue to be blocked normally by automatic script blocking.

Verifying your setup

Test that Clarity Consent Mode works correctly by opening your site in a private browser window.

Checking that Clarity loaded

Open the browser developer tools (F12), go to the Console tab, and type:

typeof window.clarity

This returns "function" if Clarity is loading correctly. If it returns "undefined", your Clarity tracking script isn’t installed or another plugin is blocking it.

Checking consent signals after accepting

Before clicking accept on your banner, paste this into the console to intercept Clarity calls:

const originalClarity = window.clarity;
window.clarity = function(...args) {
  console.log('Clarity called:', args);
  return originalClarity.apply(this, args);
};

Now accept all cookies. You’ll see output like:

Clarity called: ['consentv2', {ad_Storage: 'granted', analytics_Storage: 'granted'}]

Checking consent signals after denying

Clear your cookies and reload the page. Set up the same intercept as above, then deny all cookies. You’ll see:

Clarity called: ['consentv2', {ad_Storage: 'denied', analytics_Storage: 'denied'}]

Listening for the consent event

You can also verify the underlying wpconsent_consent_saved event fires correctly:

window.addEventListener('wpconsent_consent_saved', (e) => {
  console.log('Consent saved:', e.detail);
});

This event triggers every time a visitor saves preferences. The detail object contains the visitor’s category choices (for example {essential: true, statistics: true, marketing: false}).

Troubleshooting

Clarity Consent Mode not working

Check if the toggle is enabled. Navigate to WPConsent >> Settings >> Advanced and verify the Clarity Consent Mode toggle is on.

Check if the banner is enabled. Clarity Consent Mode only works when your consent banner is active. Verify that Consent Banner is toggled on in WPConsent >> Settings.

Check for a Clarity service. Go to WPConsent >> Settings and select the Cookies tab. Verify a service with clarity in the slug exists.

Clarity script is still blocked

If Clarity is being blocked despite having Consent Mode enabled, check the following:

• The service slug must contain clarity (lowercase)
• Automatic Script Blocking must be enabled in WPConsent >> Settings
• The script blocker must recognize the script as belonging to the clarity service. If you use a custom implementation, make sure the script’s name in the blocking system is clarity

Consent not reaching Clarity

Open the browser console and look for JavaScript errors. Then verify the window.clarity function exists before accepting cookies:

typeof window.clarity

If it returns "undefined", your Clarity tracking script isn’t loading. Check that it’s installed correctly and not being blocked by another plugin or security rule.

Clarity dashboard not showing consent data

Verify you’re using a recent version of the Clarity tracking script that supports the consentv2 API. Also check your Clarity project settings in the Microsoft Clarity dashboard to confirm consent mode is configured on their side.

FAQ

Do I need to modify my Clarity setup for this to work?

No. WPConsent handles the consent signals automatically. Just make sure Clarity is installed on your site and that a Clarity service exists in your cookie database.

Why isn’t my Clarity script being blocked when script blocking is on?

When Clarity Consent Mode is enabled, WPConsent intentionally skips blocking for Clarity. The script loads in a cookieless mode and relies on Clarity’s own consent API instead of script blocking.

How is this different from Google Consent Mode?

Google Consent Mode sets a default denied state at page load and then updates it after consent. Clarity Consent Mode doesn’t set a default state. Instead, Clarity loads normally without cookies and waits for WPConsent to communicate consent through the consentv2 API.

Can I use Clarity Consent Mode and Google Consent Mode at the same time?

Yes. Both features work independently. WPConsent sends the appropriate consent signals to each service based on the visitor’s choices.

Conclusion

Clarity Consent Mode lets Microsoft Clarity collect cookieless behavioral data while respecting visitor privacy choices. WPConsent handles the entire integration automatically, from skipping script blocking to sending consent signals when visitors interact with your banner.

To learn how WPConsent handles consent for Google services, see the guide on setting up Google Consent Mode v2.