首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >hexo博客中添加gitalk评论插件

hexo博客中添加gitalk评论插件

作者头像
foochane
发布2019-05-31 16:14:29
9650
发布2019-05-31 16:14:29
举报
文章被收录于专栏:foochanefoochane

1 新建仓库

申请地址:https://github.com/settings/applications/new

填写申请内容:

记住Client IDClient Secret

2 添加代码

*/layout/_partial/下新建一个comment.ejs,添加如下内容:

<link rel="stylesheet" href="<%- theme.libs.css.gitalk %>">
<link rel="stylesheet" href="/css/my-gitalk.css">

<div class="card gitalk-card" data-aos="fade-up">
    <div id="gitalk-container" class="card-content"></div>
</div>

<script src="<%- theme.libs.js.gitalk %>"></script>
<script>
    let gitalk = new Gitalk({
        clientID: '<%- theme.gitalk.oauth.clientId %>',
        clientSecret: '<%- theme.gitalk.oauth.clientSecret %>',
        repo: '<%- theme.gitalk.repo %>',
        owner: '<%- theme.gitalk.owner %>',
        admin: <%- JSON.stringify(theme.gitalk.admin) %>,
        id: '<%- date(page.date, 'YYYY-MM-DDTHH-mm-ss') %>',
        distractionFreeMode: false  // Facebook-like distraction free mode
    });

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

在post页添加:

{% elseif theme.gitalk.enable %}
    <%- partial('_partial/comment') %>
{% endif %}

3 修改配置文件

*/_config.yml中增加以下内容:

gitalk:
  enable: true #用来做启用判断可以不用
  owner: #Github 用户名,
  repo: #储存评论issue的github仓库名
  admin: #Github 用户名,
  oauth:
    clientID: #`Github Application clientID`
    clientSecret: #`Github Application clientSecret`

4 查看效果

部署代码后,访问博客页面

第一次访问需要登陆,github账号。

关联账号,授权:

之后就可以使用评论了:

到这里,gitalk插件就添加成功了。

本文作者:foochane 本文链接:https://foochane.cn/article/2019052801.html

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2019.05.28 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1 新建仓库
  • 2 添加代码
  • 3 修改配置文件
  • 4 查看效果
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档