Github 博客评论插件:Gitalk/gitment 集成

Github-Gitalk 200 25/09/2019

博客评论插件 Gitalk 集成

为了给博客加个第三方评论插件,首先选择了 github 开源项目 Gitment,然后种种原因原作者不再更新服务器api跨域转发失败;所以 Gitment 暂时不能用

然后选择了 Gitalk:作者 Github 项目地址演示Demo


另外 Gitalk 的使用方式和 Gitment 神似,下面是配置流程



  link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.css"
  script src="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js"

  或者

  link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css"
  script src="https://unpkg.com/gitalk/dist/gitalk.min.js"
  

npm安装就不说了,作者项目有写。然后就是使用方式:

添加一个容器:


  div id="gitalk-container">


在需要显示评论的页面添加以下js:(注意代码注释)


  var gitalk = new Gitalk({
    clientID: 'GitHub Application Client ID',  //这里的 ID 对应 GitHub Application 创建的 ID
    clientSecret: 'GitHub Application Client Secret',  //同上
    repo: 'GitHub repo',  //Github 的仓库名称(可新建)
    owner: 'GitHub repo owner',  //Github 仓库的所有者(github账户名)
    admin: ['GitHub repo owner and collaborators, only these guys can initialize github issues'],  //管理员,可多添加
    id: location.pathname,      // Ensure uniqueness and length less than 50
    distractionFreeMode: false  // Facebook-like distraction free mode
  })

gitalk.render('gitalk-container');  //渲染html


笔记点

上面的js所需要的id、secret等,点击这里申请,申请流程如下: