GitHub:如何让 `utteranc.es` 用于网站讨论

Question

我的网站https://friendly.github.io/HistDataVis/想使用 https://github.com/utterance 提供的看似轻量级且有用的讨论功能应用程序。

我相信我已经在我的仓库中正确安装了它，https://github.com/friendly/HistDataVis , 但它在构建时不会出现在网站上。

我对如何确定问题所在或如何纠正问题感到困惑。谁能帮忙？

作为引用，这是我的设置:

• 该网站是在 R Studio 中构建的，使用 rmarkdown 中的 distill。

• 我使用推荐的标准 JS 代码创建了 utterances.html。

    <script>
      document.addEventListener("DOMContentLoaded", function () {
        if (!/posts/.test(location.pathname)) {
          return;
        }
        
        var script = document.createElement("script");
        script.src = "https://utteranc.es/client.js";
        script.setAttribute("repo", "friendly/HistDataVis");
        script.setAttribute("issue-term", "og:title");
        script.setAttribute("crossorigin", "anonymous");
        script.setAttribute("label", "comments ??");
        
        /* wait for article to load, append script to article element */
          var observer = new MutationObserver(function (mutations, observer) {
            var article = document.querySelector("d-article");
            if (article) {
              observer.disconnect();
              /* HACK: article scroll */
                article.setAttribute("style", "overflow-y: hidden");
              article.appendChild(script);
            }
          });
        
        observer.observe(document.body, { childList: true });
      });
    </script>

• 在一个 Rmd 文件中，我使用 in_header 将其插入到生成的 HTML 文件中:

    ---
    title: "Discussion"
    date: "`r Sys.Date()`"
    output: 
      distill::distill_article:
        toc: true
        includes:
          in_header: utterances.html
    ---

• 还在我的 _site.yml 文件中使用它来应用到网站上的所有 Rmd 文件。

• 在我的 GitHub 帐户上，我在 GitHub 应用程序下安装了 utterances，并授予它访问此站点的存储库的存储库访问权限。

编辑2按照@laymonage 建议的解决方案，我修复了脚本。我现在在我的网页上看到评论部分，但是当我尝试使用它时出现错误，“未安装话语”。然而，正如我刚刚检查的那样，话语已安装。

Answer 1

这部分代码:

if (!/posts/.test(location.pathname)) {
  return;
}

阻止脚本的其余部分加载，因为它始终为 true。

条件检查location.pathname 的值是否通过正则表达式测试字符串posts 并否定它(!)。这意味着条件为 true 如果 location.pathname(当前 URL 的路径名，例如 /HistDataVis/ for https ://friendly.github.io/HistDataVis/) 字符串中的任何地方都不包含 posts。您网站上的所有页面都没有在 pathname 中包含 posts，因此脚本将在那里结束。

如果您将 /posts/ 更改为 /HistDataVis 或者完全删除 if block ，它应该可以工作。

---

或者，您也可以尝试 giscus ，一个使用 GitHub 讨论而不是问题的类似项目。有人已经制作了如何使用它的指南 Distill . 免责声明:我是 giscus 的开发者。