添加 Gitalk 评论功能


获取 Gitalk的idsecret

在 Github 仓库主页点击右上角头像,选择setting --> Developer settings–> OAuth Apps,然后点击Register a new application选项卡,新建一个授权APP设置项。

注意这里如果没有域名,就跟你主页保持一致。

OAuth App

获取Client IDClient secrets(这里我把自己的信息打码了)

ID & Secrets

修改_config.butterfly.yml配置

修改commentsgitalk栏目

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
comments:
# 在use下设置使用的评论系统,不设置则不启用。最多只能设置两个评论系统,第一个设为默认
use:
- Gitalk # 注意G大写
# - Valine
# - Disqus
text: true # 在按钮旁边显示评论名称
# lazyload: 当评论元素进入浏览器的视口时,评论系统将被加载。
# 如果设置为true,则评论计数无效
lazyload: true
count: true # 在帖子的 top_img 中显示评论数
card_post_count: false # 在主页中显示评论数

# gitalk
# https://github.com/gitalk/gitalk
gitalk:
enable: true
client_id: Your Client ID
client_secret: Your Client secret
repo: loli-eternally.github.io
owner: Loli-Eternally

重新线上部署

评论区部署和博客的线上部署步骤一样,已经整理成傻瓜式点击就送啦!


查看部署并授权

第一次会显示未找到相关的 Issue 进行评论,需要用自己的仓库的 GitHub 账号登录并授权。

Issue Not Found

授权好之后,会在 GitHub 主页的 Issue 栏目下看到新的 Issue 评论。

Issue

回到博客,发现 Gitalk 评论区已成功加载。

Comment

注意,浏览器的 Grammarly 插件会导致评论输入每次只能打一个字母,输入评论前先禁用该插件。