为 Pelican 博客添加 GitTalk 评论系统

为 Pelican 博客添加 GitTalk 评论系统

我的个人站点的本文链接:blog.cycleuser.org/wei-

我一直在使用 Pelican 来写博客,而没有使用 Hexo。

一来 Pelican 是 Python 的,我还是稍微熟悉一点点,二来是懒得换。

Pelican 默认支持 Disqus,但这对墙内用户不友好。 一时半会也没发现更好的替代品。

直到发现了 GtiTalk. 于是试了几下安装上,发现不错。

现将安装和配置的简要过程记录下来,防止自己忘记,也分享给有类似需求的朋友。

此处假设已经安装好了 Pelican。这里不再涉及 Pelican 的安装和博客的搭建。


第一步是要在 Pelican 所用的主题的 article.html 文件中加入 GitTalked 的代码。

所以要找到 Pelican 所用的主题。需要参考博客文件源目录下的一个名为 pelicanconf.py 的文件。

编辑这个文件,就可以看见其中所用的主题(Theme).

#!/usr/bin/env python
# -*- coding: utf-8 -*- #
from __future__ import unicode_literals

AUTHOR = 'CycleUsyer'
SITENAME = "CycleUser"
SITEURL = 'blog.cycleuser.org'

PATH = 'content'
TIMEZONE = 'Asia/Chongqing'
THEME = "cutalk"
DEFAULT_LANG = 'zh'

从上面的样本中就可以知道我所用的主题是THEME = "cutalk"

由此可知我所用的主题就是cutalk,在博客源文件目录下应该就有一个名字为cutalk的目录。

进入这个目录下的templates目录,用编辑器打开cutalk\templates目录下的article.html这个文件。

搜索<div id="disqus_thread">,在同一个section下加入下列代码:

<div id="gitalk-container"></div>

        <link rel="stylesheet" href="ht去掉这几个字tps://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.css">
        <script src="ht去掉这几个字tps://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js"></script>
        <script>

        var gitalk = new Gitalk({
        clientID: '你的 GitHub Application Client ID',
        clientSecret: '你的GitHub Application Client Secret',
        repo: '你的 GitHub repo',
        owner: '你的 GitHub repo 账户名',
        admin: ['你的 GitHub repo 账户名'],
        id: location.pathname,      // Ensure uniqueness and length less than 50
        distractionFreeMode: false  // Facebook-like distraction free mode
        })

        gitalk.render('gitalk-container')
        </script>

需要填写的只有上面加了你的字样的几处,例如我的设置就是:

var gitalk = new Gitalk({
        clientID: '7d9xxxxxxxxxxxxxxxxx',
        clientSecret: '02e3xxxxxxxxxxxxxxxxxxxxxxxx',
        repo: 'cycleuser.github.io',
        owner: 'cycleuser',
        admin: ['cycleuser'],

repo那里我写的就是我的博客的repo,之前我错写成了带https的地址,后来改写成直接的cycleuser.github.io才能用。


上面的GitHub Application ID等内容需要你点击这里来申请

申请的时候这样填写:

Application name

这个应该是可以随便填写的,比如我写的就是blog.cycleuser.org.talk

Homepage URL

这个一定要写完整的博客域名,比如我写的就是https://blog.cycleuser.org/

Application description

这个应该是可以随便填写的,比如我写的就是blog.cycleuser.org.talk

Authorization callback URL

这个一定要写完整的博客域名,比如我写的就是https://blog.cycleuser.org/


把上面的修改完成后,保存好刚刚修改过的article.html,然后用 Pelican 重新生成 html,推送同步到博客所在的repo上面,刷新博客文章页面,就应该能看到评论框了。

比如我在这篇文章下发个评论,就会在博客所在的 repo下新增一个issuegithub.com/cycleuser/cy

编辑于 2019-08-04

文章被以下专栏收录