博客搭建八:hugo添加gitalk评论功能

好的想法需要交流。
我们的博客已经搭建好了,可以再上面愉快的发文章,但是我们需要一个连接外界和别人交流的窗口,一如多年前QQ的四四方方的长条聊天框,拉近了我们彼此的联系。

评论系统的选择

每种评论体统都有各自的优缺点,这里选择gitalk评论系统,光从名字就知道它与GitHub有关。
首先,打开D:\博客根目录\themes\LoveIt\layouts\posts里的single.html文件,在底部{- /* Comment */ -}}下面添加{ {{- partial “comment.html” . -}},在D:\博客根目录\themes\LoveIt\layouts\partials下创建gitalk.html文件,并复制粘贴进以下内容:

{{ if .Site.Params.enableGitalk }}
{{ end }}

我们先注册一个GitHub账号,然后创建一个空的仓库用来存放你的评论。仓库建完以后,从设置里选择开发者选项,然后建立一个OAuth Apps见下图:
博客搭建八:hugo添加gitalk评论功能_第1张图片
博客搭建八:hugo添加gitalk评论功能_第2张图片
上面两项要在主题配置文件修改:

[params.page.comment.gitalk]
        enable = true # 启用评论功能
        owner = "c2h5oc2h5" # 用户名
        repo = "changyan" # 评论仓库名
        clientId = "xxx" # 上图第一项
        clientSecret = "xxx" # 上图第二项

最后两项是你GitHub pages 上你的博客域名,如果你和我一样绑定了域名,一定一定要把上面最后两项的地址填写你的域名,不然当你初始化评论时(第一次需要登录你的GitHub账号,在博客下面评论区的位置,登录一次以后就不用再登陆了),会跳转到你的博客首页。搭建完成如下图所示。
博客搭建八:hugo添加gitalk评论功能_第3张图片
按照顺序设置下来基本不会遇到ERROR:NOT FOUND问题,至此评论系统就搭建好了。

你可能感兴趣的:(博客搭建系列,javascript,前端,github)