此博客系统使用的是基于Giuhub的Hexo生成的静态页面，一直想用Github的Issues作为评论系统，无意中发现Gitment就是基于这个理念开发的，因此做一个集成，实施步骤如下。

Github授权接入

点击此处注册一个新的OAuth application，[Authorization callback URL]这一项特别重要，需要填写GitHub博客地址，如果GitHub绑定了域名需要填写域名，并且需要加http://或https://。

OAuth

注册完成之后会得到一个Client ID和一个Client Secret，这两个后续会用到。已经注册好的OAuth App可以在GitHub –> Settings –> Developer settings –> OAuth Apps里进行查看。

Apollo主题设置

因为我的Bolg使用的是Apollo主题，这里需要进行一些配置。

/themes/apollo/_config.yml

1
2
3
4
5
6
7
8
9
10
# Comment
# e.g disqus: seansun
disqus:
duoshuo:
gitment:
    enable: true
    owner: CharleyWuCL
    repo: charleywucl.github.io
    client_id: <Replace me! Your Client ID>
    client_secret: <Replace me! Your Client Secret>

/themes/apollo/layout/partial/comment.jade 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
if theme.gitment.enable
    - var date = page.date
    #container
    link(rel='stylesheet', href='https://imsun.github.io/gitment/style/default.css')
    script(src='https://imsun.github.io/gitment/dist/gitment.browser.js')
    script.
        var gitment = new Gitment({
            id: '#{date}',
            owner: '#{theme.gitment.owner}',
            repo: '#{theme.gitment.repo}',
            oauth: {
                client_id: '#{theme.gitment.client_id}',
                client_secret: '#{theme.gitment.client_secret}',
            },
        })
        gitment.render('container')

开放文章评论

Hexo配置好之后使用hexo clean –> hexo g –> hexo d重新部署一下Bolg。此时点开一篇文章就能看到以下页面。新建的文章需要点击[Initialize Comments]才能开始评论。

comment

参考链接

Page: https://imsun.net/

GitHub:https://github.com/imsun/gitment