经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置:技术经验 » 软件/图像 » Git » 查看文章
在个人博客中优雅的使用Gitalk评论插件
来源:cnblogs  作者:周伟伟的技术博客  时间:2019/4/1 9:08:08  对本文有异议

在上一篇博客《程序员如何从0到1搭建自己的技术博客》中,我们了解了如何快速的从0到1搭建一个个人博客。

其实细心的你会发现,该博客用到了一个评论插件,这个插件就是Gitalk。

如果想要在博客中正确的使用该插件,还是需要修改下_config.yml里关于Gitalk的配置的。

也许你会好奇Gitalk是什么?有什么用途?

我们打开下Gitalk的官网https://gitalk.github.io/,就能看到答案。

Gitalk其实就是一个评论插件,访问网站的用户可以使用GitHub账号登录后进行文章评论,博主也可以进行回复,增进交流。

那么接下来我们详细讲解下,如何在博客中使用Gitalk插件。

1.申请OAuth Application

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

申请完成后,可以在GitHub-->Settings-->Developer settings看到:

在详情页,可以看到刚刚申请的clientID与clientSecret:

2.修改_config.yml关于Gitalk的配置

为方便对比展示,我这里截取下我的修改记录:

3.开启GitHub仓库的Issues功能

只有打开该配置,每次打开新发布的博客(新页面),都会生成一个新的Issues,该页面所有的评论都会汇总在该Issues下:

4.最终生成的代码

  1. <link rel="stylesheet" href="http://www.zwwhnly.com/assets/css/gitalk.css">
  2. <script src="http://www.zwwhnly.com/assets/js/gitalk.min.js"></script>
  3. <div id="gitalk-container"></div>
  4. <script>
  5. var gitalk = new Gitalk({
  6. id: '/spring/2019/03/06/javaconfig-bean.html', // 自动生成每个页面的地址,注意不要重复
  7. clientID: 'clientID',
  8. clientSecret: 'clientSecret',
  9. repo: 'zwwhnly.github.io', // GitHub仓库名
  10. owner: 'zwwhnly', // GitHub用户名
  11. admin: ['zwwhnly'], // GitHub用户名
  12. perPage: 50
  13. })
  14. gitalk.render('gitalk-container');
  15. </script>

如果是其他的网站,直接添加以上代码(稍作修改)就可以开始使用Gitalk。

5.效果预览

6.参考链接

GitHub评论Gitalk插件

原文链接:http://www.cnblogs.com/zwwhnly/p/10634019.html

 友情链接:直通硅谷  点职佳  北美留学生论坛

本站QQ群:前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

W3xue 的所有内容仅供测试,对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接(目前9元/月)请联系QQ:27243702 沸活量
皖ICP备17017327号-2 皖公网安备34020702000426号