如何配置我的 HelpNDoc HTML 版本以使用 Microsoft Clarity?

How can I configure my HelpNDoc HTML build to use Microsoft Clarity?

如何配置我的 HelpNDoc HTML build to use Microsoft Clarity

我假设您已经对在 HelpNDoc 中使用自定义模板有所了解。您可以了解有关模板的更多信息 here.

首先编辑 topics.pas.html 文件:

在文件中找到这个位:

<!-- Content style -->
<link href="css/hnd.content.css" rel="stylesheet" />

您需要在之前添加一点新代码。例如:

<!-- Microsoft Clarity -->
<script type="text/javascript">
  (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", "~~~~~~~~~~");
</script>

Microsoft Clarity 将为您提供实际使用的代码。它看起来像上面的代码,除了 "~~~~~~~~~~" 将是您的个人 ID 值。

保存您的脚本,现在您的 HTML 版本将支持 Microsoft Clarity。


使用模板变量

可以改进模板并使其适用于多个项目。这可以通过将 hard-coded 个人 ID 替换为 模板变量 .

来完成

此处讨论 (Alternative: add a template variable to define the default Robots meta tag value)。

第 1 步

向您的模板添加一个新变量。我称它为 MSClarityID

第 2 步

更改topics.pas.html文件:

  <!-- Microsoft Clarity -->
  <script type="text/javascript">
    (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", "<% Print(HndGeneratorInfo.GetCustomSettingValue('MSClarityID')); %>");
  </script>

我们将硬编码项目 ID 更改为:

<% Print(HndGeneratorInfo.GetCustomSettingValue('MSClarityID')); %>

步骤 3

最后,在 HelpNDoc 的项目 模板设置 选项卡中指定变量的值: