Microsoft Clarity and Shopify: Integration Guide

Using Microsoft Clarity with Shopify is a great strategy for merchants who want to find out the reasons behind higher bounce rates, cart abandonment, or user experience (UX) issues.

Clarity can be easily set up on Shopify through the official Shopify app. Other installation methods include manual setup through a tracking code or using Google Tag Manager. Separately, Clarity supports integrations with Google Analytics 4 and Google Ads, and it can be enabled within the Clarity dashboard.

In this guide, we’ll guide you through multiple Microsoft Clarity installation methods for Shopify stores. You’ll find out how each setup process is different and which one is best for you.

What Is Microsoft Clarity?

Microsoft Clarity is a free tool for website analytics that helps you analyze how users interact with your website. Here are the main features that can help you analyze user behavior:

• Heatmaps – visually show you exactly where users click on your site and where they move their mouse.
• Session recordings – let you view anonymized recordings of how users navigate your website.
• Behavior insights – demonstrate things like where users do rage clicks, which is repeated clicking, and dead clicks, which mean clicks that don’t do anything.

Why use Microsoft Clarity with Shopify?

Using Microsoft Clarity with Shopify is a great way to find UX issues on your website. Here’s why it’s useful for Shopify stores:

• Find out why users leave. Instead of simply tracking bounce rates, you can find out the reasons your site visitors leave without making a purchase by watching how they move through your store.
• Reduce purchasing friction. You can use heatmaps to see how people scroll and what they click, revealing ineffective call-to-action buttons or rage clicks.
• Optimize checkout. Clarity allows watching session recordings which can reveal how users move through checkout. You can see where they abandon the cart or struggle to enter information.
• Monitor mobile behavior. Clarity lets you track users on specific devices, like smartphones and tablets. This lets you analyze issues that may only be present on smaller screens, like the sticky header covering important buttons.

How to install Microsoft Clarity on Shopify: 3 methods

There are multiple methods you can use to install Microsoft Clarity on Shopify, including using an app, editing theme files, or using Google Tag Manager.

Method 1: Install Clarity as a Shopify app (recommended)

You can install Clarity through a Shopify app – it’s a great method if you don’t want to touch code. The only limitation is that it doesn’t integrate with Google Analytics 4 or Google Ads.

Here’s how to set up Microsoft Clarity through the app:

1. Sign up to Microsoft Clarity.
2. Confirm your email and accept Clarity Terms of Use.
3. Create a new project on Clarity. Insert your Shopify store name, website URL, and industry.
4. Now you’ll have to install the Microsoft Clarity Shopify app. Click the “Install on Shopify” button on Clarity or go to the Shopify App Store and locate the app.
5. Click Install on the app’s page.
6. You’ll be redirected to your Shopify Admin to finish the setup. Click “Go to theme settings.”
7. Enable the Microsoft Clarity theme extensions and click Save.
8. Go back to the Microsoft Clarity app. The data will be ready to view.

Method 2: Install Clarity through Google Tag Manager

You can install Clarity through Google Tag Manager if you want to integrate your Google Ads and Google Analytics 4 account data.

You can follow these steps to set up Clarity:

1. Create a Microsoft Clarity account. Add your Shopify store name and URL, and select the industry.
2. You’ll be given 3 installation methods – choose “Install manually.”
3. You’ll see a tracking code on your screen. Click Copy to clipboard.
4. Log in to your Google Tag Manager account.
5. Go to Tags > New and name the tag as “Clarity Tag.” Click the Edit icon under Tag Configuration.
6. Click Custom HTML under the Custom section.
7. Paste the copied tracking code in the HTML field.
8. Scroll to the “Triggering” section and click on it.
9. Select All pages, press Add, and then click Save.
10. Click Publish, and your Microsoft Clarity tracking code is installed.

Method 3: Install Clarity through a tracking code

If you don’t want to set up a Google Tag Manager account, you can add the Microsoft Clarity tracking code directly to your Shopify theme files.

Here’s how to do it:

1. Create a Microsoft Clarity account and insert your store name, website URL, and industry.
2. Click Get tracking code under the Install manually section.
3. Press Copy to clipboard to copy the tracking code.
4. Open Shopify Admin > Online Store > Actions > Edit code.
5. Locate the theme.liquid file, open it, and find the </head> tag.
6. Paste the tracking code right before the closing </head> tag.
7. Click Save.

How to ensure Microsoft Clarity is privacy compliant on Shopify?

If you use Microsoft Clarity on your Shopify store, you need to ensure you gain user consent for tracking.

Here’s how to ensure privacy compliance with Clarity:

1. Use a Consent Management Platform

To ensure proper consent, you need to use a Consent Management Platform (CMP) on Shopify. It adds a cookie banner on your website that helps collect user consent and blocks tracking until it’s received.

Make sure you use a CMP that supports Google Consent Mode V2 integration, like TinyCookie or Consentmo. This way, when Consent Mode V2 is set up, it will pass the consent choices to Clarity automatically.

2. Add a privacy policy statement

Aside from a consent banner, you must also disclose that you’re using Microsoft Clarity in your privacy policy. It should explicitly state that you use Clarity, what you use it for, what data it collects, and the legal basis for processing. You can even add a link to the Microsoft privacy policy.

Microsoft suggests a sample wording for this statement that you can adapt to your own store:

Final thoughts

Microsoft Clarity is a valuable tool for Shopify stores that want to reduce purchasing friction and reduce bounce rates. It allows watching anonymized session recordings and exploring how users move, where they click, and why they leave.

You can install the Microsoft Clarity app on Shopify to set the tool up in seconds, but note that you won’t be able to integrate it with Google Ads or Google Analytics. If that’s what you need (or you simply don’t want another app on your store), then you can set up Clarity through theme files or Google Tag Manager.

We highly recommend Clarity for Shopify merchants who are on a budget, since it’s completely free and is a great addition to analytics tools you already use.

×

About the author

Kristina Jaruseviciute

Kristina is a Content Lead at TinySEO responsible for informing and educating readers on all things Shopify-related. She covers a broad range of topics around SEO, AI visibility, website performance, and conversion rates to help merchants stand out in a competitive landscape.