Hugo 中启用 Giscus 评论

在《使用 Hugo + Github Pages + Github Actions 免费搭建个人博客》博客文章中分享了如何使用 Hugo + Github 搭建一个免费的博客网站，这篇博客文章分享如何在 Hugo 博客中启用 Giscus 评论。

Giscus 是利用 GitHub Discussions 实现的评论系统，开源、无跟踪、无广告、永久免费。

Hugo 对 Giscus 有很好的支持，在 hugo-theme-jane 主题中配置启用Giscus 很简单。

要启用 Giscus 请先确保：

1. 仓库是公开的，否则访客将无法查看 discussions。
2. giscus app 已安装，否则访客将无法评论和回应。
3. Discussions 功能已在你的仓库中启用。

前面搭建的博客仓库就是公开的，满足了第一点，接下来要做的就是安装 Giscus app 和启用 Discussions。

安装 Discus app

打开 Discus app 打开安装地址，然后点击 install，会出现如下页面：

选择 Only select repositories，然后选择要安装的仓库，这里应该选择 <username>/<username>.github.io，我选择的就是 codeaer/codeaer.github.io，然后点击 install 安装 。

启用

在 <username>/<username>.github.io 仓库下，点击 Settings，启用 Discussions。

获取 Giscus 配置信息

打开 https://giscus.app/zh-CN，选择语言/仓库/页面：

选择分类/特性/主题： 然后在启动里面就有我们要的配置信息：

配置 Giscus

在 Hugo 博客站点根目录下，打开 config.toml文件，添加如下配置项：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

  [params.giscus]         # giscus is a comment system based on GitHub Discussions. see https://giscus.app
    enable = true
    repo = "codeaer/codeaer.github.io"
    repoId = "R_kgDOKH6qOA"
    category = "Announcements"
    categoryId = "DIC_kwDOKH6qOM4CYqRn"
    # mapping = "pathname"  # comment value is the default value
    # strict = 0
    # reactionsEnabled = 1
    # emitMetadata = 0
    # inputPosition = "top"
    # theme = "light"
    lang = "zh-CN"
    # lazyLoading = false

⚠️注意：这里的 repo、repoId、category、categoryId 要填你上面获取到的对应的值。

到此为止就配置并启用了 Giscus 评论，启动 Hugo 服务预览，随便打开一篇文章就可以看到已经有评论功能：