hexo Next主题 5.1.4版本下配置Gitalk

前言


      关于配置gitalk,本文不求最详细,但求最简单粗暴。适合踩过一些坑之后的同学,从0开始的同学建议结合其它教程使用。

添加代码


      位置:blog/themes/next/layout/post.swig

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
{% block content %}

<div id="posts" class="posts-expand">
{{ post_template.render(page) }}

<div class="post-spread">
{% if theme.jiathis %}
{% include '_partials/share/jiathis.swig' %}
{% elseif theme.baidushare %}
{% include '_partials/share/baidushare.swig' %}
{% elseif theme.add_this_id %}
{% include '_partials/share/add-this.swig' %}
{% elseif theme.duoshuo_shortname and theme.duoshuo_share %}
{% include '_partials/share/duoshuo_share.swig' %}
{% endif %}
</div>
</div>

<!-- 下一行是要添加的代码 start -->
<!-- Link Gitalk 的支持文件 -->
<link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css">
<script src="https://unpkg.com/gitalk@latest/dist/gitalk.min.js"></script>
<div id="gitalk-container"></div> <script type="text/javascript">
var gitalk = new Gitalk({

// gitalk的主要参数
clientID: '你的clientID,这个不会创建的话去其它教程看一下',
clientSecret: '你的clientSecret,这个不会创建的话去其它教程看一下',
repo: '你的仓库名,仓库名,仓库名,不是地址!',
owner: '你的用户名',
admin: ['你的用户名'],
id: window.location.pathname,

});
gitalk.render('gitalk-container');
</script>
<!-- Gitalk end -->
<!-- 到一上行结束 end -->

{% endblock %}

      把文件中添加的代码加上(看注释),然后把后面的参数填上。

注意事项


      1. GitHub -> OAuth -> Authorization callback URL:这里要填博客地址,绑定了域名就填域名。加http(s)://

      2. 上面代码中repo后面可以用一个新建的仓库,但注意只填名字就行了。

      3. 用户名要填对。

      4. 设置完之后若显示未找到相关的issues进行评论,请在提示下方点击登录Github,每篇文章页面都需要点击一次进行初始化。

念念不忘,必有回响。