如何设置Microsoft Clarity仅录制网站的部分内容？

Clarity支持通过配置规则控制录制范围，你之前把脚本插入div的方式无效——因为Clarity加载后会全局监听文档事件，和插入位置无关。以下是可行的解决方法：

方法1：用block API屏蔽iframe或非目标区域 #

初始化Clarity后，调用clarity("block", 选择器)来完全排除指定元素（比如所有iframe）：

React.useEffect(() => {
  // 初始化Clarity
  (function(c,l,a,r,i,t,y){
    c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
    t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
    y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
  })(window, document, "clarity", "script", "<CLARITY-PROJECT-ID>");

  // 确保Clarity加载完成后执行屏蔽操作
  const applyBlocking = () => {
    if (window.clarity) {
      // 屏蔽所有iframe
      clarity("block", "iframe");
      // 可选：屏蔽其他不需要录制的区域
      // clarity("block", "#unwanted-section");
    } else {
      setTimeout(applyBlocking, 500);
    }
  };
  applyBlocking();
}, []);

方法2：用mask API模糊无关区域 #

如果只是不想显示某些区域的具体内容（而非完全不录制），可以用mask API：

// 模糊指定区域内容
clarity("mask", "#non-target-div");

方法3：通过Clarity后台配置全局规则 #

登录Clarity项目后台，进入设置 > 数据收集 > 元素排除规则，添加CSS选择器：

• 要排除所有iframe，直接填iframe
• 要仅录制#myDiv区域，可设置规则排除除该元素外的所有内容（或结合包含规则）

这种方式无需修改代码，适合统一管控所有页面的录制范围。

内容的提问来源于stack exchange，提问作者Łukasz Sypniewski