概述

utterances是一个基于GitHub issue,拥有多种主题的开源小组件,本文将简述使用如何在hugo博客部署utterances

配置过程

新建仓库

新建一个公开的仓库,用于存放评论,名字随意。作者在此处创建一个名为utterances的公开仓库。

安装utterances

GitHub Apps - utterances

点击安装即可,选择仓库:

IEIPJW.jpg

安装完成后会自动跳转到官方页面。

在文件中添加插件

官方文档:utterances

修改footer.html文件,以PaperMod主题为例:

<footer class="footer">
    {{- if .Site.Copyright }}
    <span>{{ .Site.Copyright | markdownify }}</span>
    {{- else }}
    <span>&copy; {{ now.Year }} <a href="{{ "" | absLangURL }}">{{ .Site.Title }}</a></span>
    {{- end }}
    <span>&middot;</span>
    <span>Powered by <a href="https://gohugo.io/" rel="noopener noreferrer" target="_blank">Hugo</a></span>
    <span>&middot;</span>
    <span>Theme <a href="https://git.io/hugopapermod" rel="noopener" target="_blank">PaperMod</a></span>

    <script src="https://utteranc.es/client.js"
        repo="oopsdc/utterances"
        issue-term="title"
        theme="github-light"
        crossorigin="anonymous"
        async>
    </script>
</footer>

运行命令hugo server进入一篇文章即可查看评论插件效果。

至此,utterances评论插件已成功部署。

参数详解

在官方文档中,有不少的参数,如映射到issue的方式、issus标签、主题等,在选择完相应参数之后,会在Enable Utterances处自动生成配置代码,即上述代码。此处详解六种issus映射方式。

  • Issue title contains page pathname

Utterances将搜索一个标题包含博客文章路径名URL组件的issue。如果没有找到匹配的issueUtterances将在第一次发表评论时自动创建。

  • Issue title contains page URL

Utterances将搜索一个标题包含博客文章URL的issue。如果没有找到匹配的issueUtterances将在第一次发表评论时自动创建。

  • Issue title contains page title

Utterances将搜索标题包含博客文章标题的issue。如果没有找到匹配的issueUtterances将在第一次发表评论时自动创建。

  • Issue title contains page og:title

Utterances将搜索一个标题包含页面的Open Graph标题元的issue。如果没有找到匹配的issueUtterances将在第一次发表评论时自动创建。

  • Specific issus number

手动配置Utterances来按编号加载一个特定的issueissue不会被自动创建。

  • Issue title contains specific term

手动将Utterances配置为搜索标题包含手动选择的特定术语的issue。如果没有找到匹配的issueUtterances会在第一次发表评论时自动创建。该issue的标题将是你选择的术语。

本文选择title方式,即对应评论会以文章标题作为issue标题在仓库下自动创建。

文章许可:本文采用CC BY-NC-SA 4.0许可协议,转载请注明出处。