插件 Gitment第三方评论插件自定义样式

本文总共 745 字 · 阅读全文大约需要 3 分钟
(2019-11-25) @Sleepyhead    


感觉Gitment的默认样式不怎么符合个人审美,所以只能自己动手魔改下了,顺手也给它简单的汉化了下。 先来2张图对比下效果吧。

效果

  • 默认

Gitment默认样式

  • 修改后

Gitment修改后的样式

安装

  • 注册OAuth Application

    点击这里 注册一个 OAuth Application。确保填入正确的 callback URL(一般是评论页面对应的域名,如:https://too.pub

  • 安装Gitment

    在你需要插入评论框的位置添加以下代码

<div id="container"></div>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/toopub/netdisk/gitment/gitment.min.css">
<script src="https://cdn.jsdelivr.net/gh/toopub/netdisk/gitment/gitment.browser.min.js"></script>
<script>
var gitment = new Gitment({
  id: window.location.pathname,
  owner: '你的GitHub用户名',
  repo: '存储评论的repo',
  oauth: {
    client_id: '你的client ID',
    client_secret: '你的client secret',
  },
});
gitment.render('container')
</script>

下载

如果你不想引用外部资源可以点击下方链接下载相关资源并上传至你的服务器