Microsoft Clarity Integration Guide

Microsoft Clarity is a free tool for screen recording that shows how users interact with your website. By integrating Clarity, Shopify merchants can watch the screen recordings of their visitors, view heatmaps, and figure out how to improve their website to better their conversion rates. Analyzify is perfectly integrated with Microsoft Clarity. Let's get started and set it up!

Microsoft Clarity Integration Methods with Analyzify

Analyzify offers two integration methods for Microsoft Clarity setup:

• Direct Integration
• Customized Integration (with GTM)

To understand the differences between these methods and choose the one that best suits your needs, please read our guide on choosing the right integration method .

Important Notes Before Setup: 

1. Choose only one integration method. Do not activate both methods simultaneously.
2. Enable the Analyzify app embed toggle on your live theme, otherwise completing the integration steps wouldn’t activate the Microsoft Clarity. 
3. Don’t forget to connect your custom pixel to track checkout steps. 

1. Direct Integration Method

Follow the steps for direct integration method:

Step 1

Connect

Click "Connect" on Microsoft Clarity card in Analyzify.

Step 2

Microsoft Clarity Project ID

You'll see a field asking for Microsoft Clarity Project ID. To get your Project ID:

1. Head to Microsoft Clarity website and sign up
2. Create a new project
3. After project creation, find your Project ID in the Overview section

Step 3

Save Changes

Enter your Project ID in Analyzify and then click "Save Changes"

Step 4

Code Block

After clicking Save Changes, you'll see a page with a code block. You need to:

1. Click "Copy to clipboard" to copy the provided code
2. This code will be used in the next steps for custom pixel setup

Step 5

Custom Pixel Setup

Go to Shopify Customer Events

Click "Add custom pixel"

Name it "Analyzify 4.0 Microsoft Clarity"

Under Customer Privacy:

• Choose "Not required"
• Check "Data collected does not qualify as data sale"

Paste the copied code into the Code field

Click "Save" then "Connect"

If you have an old version of Analyzify's Microsoft Clarity:

• Disconnect it to prevent double counting
• Delete it before proceeding with the new version

Step 6

Finish Setup

Check "I added the code and connected the new pixel" and then click "Finish Setup"

Important : Always disconnect and delete old versions before adding new ones to avoid duplicate tracking.

2. Customized (GTM) Integration 

To proceed with the GTM integration, make sure you have a Google Tag Manager account and access to your Microsoft Clarity account. Then follow these steps:

1. Activate the customized (GTM) Integration within the Analyzify app.
2. During the final setup stage, select Microsoft Clarity when choosing your desired integrations for the GTM container creation.
3. Download the generated container and import it to your Google Tag Manager account.  See our step-by-step guide here  .
4. Configure your Microsoft Clarity variables by  following our documentation . Enter your Microsoft Clarity Project ID and unpause your Microsoft Clarity tags.
5. Test your Microsoft Clarity tags using GTM Preview mode to ensure everything is working correctly.  Learn more about how to use GTM preview mode  .

For detailed instructions and best practices,  refer to our complete GTM setup guide  .

Frequently Asked Questions (FAQs)