Hexo Next主题Giscus评论

发表于 更新于 分类于 阅读次数：

Hexo 是一个快速、简洁且高效的静态博客框架，Next 是 Hexo 的一个优雅的主题。Giscus 是一个利用 GitHub Discussions 作为评论系统的工具。要在 Hexo 的 Next 主题中添加 Giscus 评论系统，你可以按照以下步骤操作：

准备工作

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

设置步骤

  1. 注册 Giscus 并获取配置：

  2. 在你的 Hexo 博客目录中执行以下命令，安装 hexo-next-giscus 插件

    1
    npm install hexo-next-giscus --save

  3. 编辑 Next 主题的配置文件：

    • 打开 Hexo 博客的根目录。
    • 编辑 _config.next.yml 文件（这是 Next 主题的配置文件）。

  4. 添加 Giscus 配置：

    • 找到 comments 部分。
    • 添加 Giscus 配置，如下所示：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    # _config.next.yml
    comments:
      giscus:
        enable: true
        repo: <YOUR_GITHUB_USERNAME/YOUR_REPO_NAME>
        repo_id: <YOUR_REPO_ID>
        category: <YOUR_CATEGORY_NAME>
        category_id: <YOUR_CATEGORY_ID>
        mapping: pathname
        reactions_enabled: 1
        emit_metadata: 0
        input_position: bottom
        lang: en
        loading: lazy
        crossorigin: anonymous

    确保将 <YOUR_GITHUB_USERNAME/YOUR_REPO_NAME> 等内容替换为你实际的 GitHub 用户名和仓库名称等信息。

  5. 更新 Hexo 博客：
    保存配置文件后，在博客根目录下执行以下命令来生成静态文件并部署：

    1
    2
    3
    hexo clean
    hexo generate
    hexo deploy

这样，你的 Hexo 博客的 Next 主题中应该就会显示 Giscus 评论系统了。如果有任何问题，请确保检查 Giscus 的配置是否正确，并确认你的 GitHub 仓库和 Discussions 设置正确。