Ever wondered if there’s a way to really understand what’s going on with your website? Why are some posts hit and others a miss? Well, that’s where Microsoft Clarity’s Content Insights comes into play, and trust us, it’s a game-changer.

The Inside Scoop

So, here’s the deal: Content Insights is like having a super-smart friend who watches how people interact with your site. It notices the little things – which articles people love, how many they read, and even where they seem to get stuck or lose interest.

Content Insights

The cool part? You can get the lowdown on specific stuff you care about such as:

Reader types: Categorizes sessions based on the number of articles viewed.

• One and done – read 1 article
• Casual – read 2-3 articles
• Serious – read 4 or more articles

Reading behavior: Categorizes readers by how they consume the articles.

• Engaged – User finished reading one or more articles
• Abandoned at headline – This one sounds as it is. The user only reads the headline and nothing else.

Clarity callouts: We thought it’d be nice to give you some high-level insights to your data with Clarity callouts (pictured above). The callout is determined by what Clarity believes are the most interesting and helpful data points for you. Pretty cool.

Setting Up Content Insights

Most WordPress blogs already have Content Insights readily available, providing valuable insights into your audience’s engagement with your content. If not, to enable this feature, please refer to the “Content Insights documentation” for detailed guidance and tips.

The Bottom Line

Microsoft Clarity’s Content Insights is not just another tool; it’s your website’s best ally in understanding and enhancing user engagement. Dissecting reader behaviors and preferences empowers you to tailor your content strategy to meet your audience’s needs more effectively. Whether you’re aiming to convert one-and-done visitors into regular readers or to deepen the engagement with your serious audience, Content Insights provides the clarity you need to make informed decisions.

In the digital world, success is closely tied to understanding user behavior, a task made easier with tools like Microsoft Clarity. This analytics tool sheds light on how users interact with your website or application, providing crucial insights for optimization. However, before diving into analytics, you need a digital platform, and this is where many hit a roadblock: coding. The complexity of web development can be daunting, but there’s a solution that sidesteps this hurdle—Webflow.

What is Webflow?

Webflow is a visual development platform that empowers designers to build with the full power of code — without writing any. Instead of typing out code, you develop it visually in a way that is intuitive to how you work. As you build in Webflow, it automatically generates the same production-grade HTML, CSS, and JavaScript that powers the web’s most sophisticated sites. It’s the best of both worlds: get the autonomy and speed of simple website builders combined with the power and flexibility of code. With Webflow, there’s no limit to what you can build. The only limit is your imagination.

Better together

When Webflow and Microsoft Clarity join forces, the synergy between the two elevates the web design experience to new heights. By integrating Clarity’s behavioral analytics into your Webflow projects, you unlock the power to make informed iterations that truly resonate with your audience. Heatmaps offer a visual representation of user engagement, highlighting areas that attract the most attention or might be causing confusion. Session recordings go a step further, providing a real-time playback of user interactions, and allowing you to witness firsthand the user journey through your site. This combination of insights empowers you to tailor your Webflow creations not just to what you think your users want, but to what their actions unequivocally show they are looking for, ensuring every update or tweak is a step towards a more intuitive and user-friendly design.

Embedded View

The integration of Microsoft Clarity with Webflow lets users access Clarity’s dashboard directly within the Webflow Designer, while they are building. This seamless experience means Webflow users can analyze their site’s user behavior data without leaving the Webflow platform, keeping all essential insights in one place. Here is a list of some of the data you can access from Clarity in Webflow:

• rage clicks
• dead clicks
• javascript errors
• scroll depth
• countries
• devices
• popular pages
• referral Urls

Beyond the initial insights provided, the embedded view further expands your analytical capabilities with additional data points. It also features dedicated icons for quick access to heatmaps and session recordings in Clarity, allowing for a deeper dive into user interactions.

How to get started

Integrating Microsoft Clarity with your Webflow projects is a straightforward process that enhances your site with powerful analytics. Here’s a concise guide to get you started:

1. Clarity in Webflow: Use this direct link to the app listing in Webflow.
2. Add Clarity: You can add Clarity to your entire workspace or a specific site within Webflow.
3. Publish Changes: To activate Clarity and start collecting data, publish the changes to your site.
4. View in Designer: In Webflow’s designer view, Clarity will appear as an installed App.
5. Check Clarity Dashboard: Once data starts coming in, you can view it on the Clarity dashboard directly.

Please refer to our documentation for detailed guidance on integrating Clarity with Webflow.

The Microsoft Clarity App in Webflow is a game-changer for anyone looking to create engaging and effective websites, not just for seasoned professionals. This powerful combination democratizes web design, allowing individuals of all skill levels to harness the power of behavioral analytics and intuitive design tools. With Clarity’s insights into user behavior and Webflow’s user-friendly design platform, anyone can craft websites that resonate with their audience and drive better outcomes.

Say goodbye to guesswork and hello to a new level of insight with Clarity and Firebase! 

Now, you can gain more understanding of your customers, not only by knowing what happened, but also by knowing why it happened! By linking Clarity session recordings with Firebase, you can now access your session and user URLs directly on each of your Firebase events/screens, making it a breeze to watch video recordings and analyze the entire user experience.  

Starting 2.1.0, We have introduced the getCurrentsessionURL API, that allows you to send and connect analytical events with Clarity. This URL is versatile and can be used with popular analytics tools like Firebase, Mixpanel, and others. In this blog, we will describe the steps needed to link Clarity’s session recordings with Firebase Analytics and Crashlytics SDKs. 

Steps: 

Note: You need to have a Firebase Google Analytics account and a Clarity account. If you don’t have one, Create one here

In Firebase: 

1. On your Firebase project Dashboard, under the Analytics section click on Custom Definitions and then go to “Create custom dimensions”. 

2. Give your dimension a descriptive name and parameter.  

3. Add an “event parameter” to this dimension in. This parameter will contain the Clarity session recording URL.

In your app: 

Note: You should already have a Clarity project with Clarity’s Mobile SDK successfully integrated. If you don’t, Get started here. 

1. Navigate to the section where you initialize Clarity. (ex: MainActivity). 

2. Add callback function “Clarity.SetonNewSessionStartedCallback. This function will be triggered whenever a new clarity session starts. 

3. Get the session URL, using the clarity.getCurrentSessionURL API to get the current sessions URL that is to be sent to Firebase Analytics. 

4. Ensure that the Event name that you use in Clarity and the Event Parameter are the same that you’ve created on Firebase. 

To view Clarity’s sessions in Firebase: 

1. Navigate to your Analytics Dashboard in Firebase. 

2. View/add custom parameters to your events. For events, click on the session_started event. 

3. Navigate down to the custom parameters card. Double-click on clarity_links to highlight the value, then copy it in a new browser window. 
4. You should now see the session recording that contains session_started event in Clarity’s dashboard. 

For pages/screens, you can also see the same information by adding a custom parameter to the page/screen. 

Events in Firebase can take up to 24 hours to appear in the dashboard, but if you want to make sure that you are logging the events properly, run the following command, then check the Firebase debug view. 

adb shell setprop debug.firebase.analytics.app "yourpackagename" 

Firebase Crashlytics 

If you are using crashyltics SDK to collect your app crashes, you can just follow the same steps by calling the clarity.SetInNewSessionStartedCallback function where Clarity is initialized.  

You can view Clarity sessions’ and users’ link in the Keys section of your crashed session within Firebase console. 

If a crash occurs in your mobile app, you can gain valuable insights by analyzing the session and video recording where the crash took place. This will provide you with more context on the crash and help you understand how it affected the user journey. Additionally, you can analyze user behavior after experiencing a crash by checking the user sessions in Clarity’s user profile. By doing so, you can identify any patterns or trends that may be contributing to crashes and take steps to improve your app’s performance and user experience. 

By combining the detailed session recordings of Clarity with the robust analytics of Firebase, developers and marketers now have a powerful tool at their disposal.