How To Setup Ecommerce & Purchase Tracking In Microsoft Clarity

To set up e-commerce tracking in Microsoft Clarity, follow these steps:

1. Identify Trackable Actions: Determine the parts of the shopping journey you want to track, such as viewing an item, adding to cart, viewing the cart, beginning checkout, adding payment information, adding shipping details, and completing a purchase.

2. Customise Event Tracking Code: Use the appropriate code for each action, adjusting the event name to correspond to the user's specific e-commerce action:

<script>
window.clarity("event", "{{e-commerce action}}");
</script>

3. Use API Events: Implement API Events to track successful purchases accurately. Here is the code to execute upon a successful purchase:

<script>
window.clarity("event", "purchase");
</script>

4. Enhance Data with Custom Tags: Use Microsoft Clarity's custom tags to add more context to the data collected during the purchase event. For example, to capture a transaction ID, use:

<script>
clarity("set", "transactionID", "{{your order ID}}");
</script>

5. Use Google Tag Manager: Implement the tracking code using Google Tag Manager or Piwik Pro Tag Manager to facilitate the setup.

Tracking purchases in Microsoft Clarity offers several benefits:

• Segment Sessions: Allows you to segment sessions with and without purchases, enabling further investigation into how to enhance user experience and identify friction within the purchase journey.

• Identify Patterns: Helps discern patterns in the user purchase journey and identify barriers to conversion.

• Enhanced Insights: Provides more context to the 'Copilot in Microsoft Clarity' AI, which uses this data to provide insights into user behavior on your website.

• Custom Tags: Enables the use of custom tags to add valuable context to the e-commerce data, such as transaction ID, customer type, and spend category.

• Error Tracking: Allows you to identify JavaScript errors that occur during the purchase process, helping to improve website performance and user experience.

To use 'API Events' for e-commerce tracking in Microsoft Clarity, follow these steps:

1. Identify Trackable Actions: Determine the parts of the shopping journey you want to track, such as viewing an item, adding to cart, viewing the cart, beginning checkout, adding payment information, adding shipping details, and completing a purchase.

2. Implement API Events: Use the following code to track successful purchases accurately:

<script>
window.clarity("event", "purchase");
</script>

3. Customise Event Tracking Code: Adjust the event name to correspond to the user's specific e-commerce action:

<script>
window.clarity("event", "{{e-commerce action}}");
</script>

4. Use Google Tag Manager: Implement the tracking code using Google Tag Manager or Piwik Pro Tag Manager to facilitate the setup.

5. Enhance Data with Custom Tags: Use custom tags to add more context to the data collected during the purchase event. For example, to capture a transaction ID, use:

<script>
clarity("set", "transactionID", "{{your order ID}}");
</script>

You should avoid using 'Auto Events' for e-commerce tracking in Microsoft Clarity because:

• Inaccuracy: 'Auto Events' may not accurately represent successful transactions as they can be triggered by mere clicks on the purchase button, including unsuccessful order placements.

• Language Issues: 'Auto Events' may miss clicks when the button's text gets translated into a non-English language.

• Manual Tracking: Instead, manually track website orders and users' e-commerce actions using 'API Events' to ensure accurate tracking of successful purchases.

• Customisation: Manual tracking allows for better customisation and the use of custom tags to add valuable context to the data collected during the purchase event.