自定义 jekyll-TeXt-theme 博客的评论区

 

我们前面通过文章利用 Github Pages + jekyll-TeXt-theme 初步搭建个人博客介绍了初步搭建博客的流程。在之后的使用中,发现其提供的 comments(disqus、gitalk、valine)有些问题,经过网上查询和个人实践,发现基于 github issues 的 utteranc 和基于 github discussions 的 giscus 是可使用的。于是在这里介绍其用法(两者配置方法很相似)。

utteranc 的部署流程

  • 进入 utterances 官网,然后按照官网给定的流程进行配置:

  • 配置仓库

    image-20230812175003613

  • 配置博客文章与 GitHub 对应 issuse 的链接关键字

    image-20230812175220028

  • 设置 issue label

    image-20230812175328339

  • 设置评论展示主题

    image-20230812175351656

  • 这时会在官网生成一段以下代码,针对于这端代码,有两种用法:(1)直接粘贴在文章中你想放评论的地方;(2)将这段代码放置在文件 _layouts/article.html 内容的末尾,可自动实现你所写的所有文章的末尾都自动带上评论。

    image-20230812192526455

giscus 的部署流程

  • 进入 giscus 官网,然后按照官网给定的流程进行配置:

  • 选择语言

    image-20230812192828263

  • 配置仓库

    image-20230812193221902

  • 配置博客文章与 GitHub 对应 discussion 的链接关键字

    image-20230812193311829

  • 选择 Discussion 分类

    image-20230812193624119

  • 选择启用某些特性

    image-20230812193605951

  • 选择评论展示主题

    image-20230812200207131

  • 这时会在官网生成一段以下代码,针对于这端代码,有两种用法:(1)直接粘贴在文章中你想放评论的地方;(2)将这段代码放置在文件 _layouts/article.html 内容的末尾,可自动实现你所写的所有文章的末尾都自动带上评论。

    image-20230812200229722

  • 如果你进行了全局设置,但是你又不想你的 about 页带有评论。这时你可以将文件 _layouts/article.html 复制一份在原目录,取名为 _layouts/article2.html,并将该文件内有关评论设置的代码内容删除。然后打开处于根目录的 about.md,将其 YAML 头信息 layout 的 article 改为 article2。这时我的 about.md 的头文件信息为:

    ---
    layout: article2
    titles:
      # @start locale config
      en      : &EN       About
      en-GB   : *EN
      en-US   : *EN
      en-CA   : *EN
      en-AU   : *EN
      zh-Hans : &ZH_HANS  About
      zh      : *ZH_HANS
      zh-CN   : *ZH_HANS
      zh-SG   : *ZH_HANS
      zh-Hant : &ZH_HANT  關於
      zh-TW   : *ZH_HANT
      zh-HK   : *ZH_HANT
      ko      : &KO       소개
      ko-KR   : *KO
      fr      : &FR       À propos
      fr-BE   : *FR
      fr-CA   : *FR
      fr-CH   : *FR
      fr-FR   : *FR
      fr-LU   : *FR
      # @end locale config
    key: page-about
    ---
    

个人选择

由于 Github 的 Discussions 相较于其 Issues 更适合用来做评论,所以我最终选择了基于 Github Discussions 的 giscus 来搭建本博客的评论系统。已经来到这里的朋友们不妨在下方的评论区留下你们的足迹,也顺带看看 giscus 是否符合你们的心意。

参考资料