503 字
3 分钟
为 Hexo 主题 indigo 添加 gitment 支持
缘起
却说 hexo 评论系统有 disqus、多说之类。近来多说倒闭,更换新评论系统成为要务。gitment 是新近出现的利用 github issue 系统作评论的评论系统。具有使用方便、免费等优点。因此打算采用此系统。
问题
插件系统
观察主题文件结构
├── _config.yml├── layout│ ├── _partial│ │ ├── ......│ │ ├── plugins│ │ ├── post│ │ ├── ......发现插件是存储在 plugins 文件夹下的 ejs 模版,打开 disqus.ejs 观察
<% if (theme.disqus_shortname){ %><section class="comments" id="comments"> <div id="disqus_thread"></div> <script> var disqus_shortname = '<%- theme.disqus_shortname %>'; lazyScripts.push('//' + disqus_shortname + '.disqus.com/embed.js') </script> <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript></section><% } %>theme.disqus_shortname 为配置文件中 disqus 的调用名称,又做真值判别又做变量。gitment 参数众多就不这样设置。
主题定义了 comments 块放置评论系统,这个写在 indigo/layout/_partial/post/comment.ejs。内容如下:
<% if(post.comments){ %><%- partial('../plugins/duoshuo', { key: post.slug, title: post.title, url: url }) %>
<%- partial('../plugins/disqus') %>
<%} %>用 partial 加载,因此添加 <%- partial(’../plugins/gitment’) %> 用来加载 gitment 插件
gitment 文档介绍加载方法如下:
~~~
gitment.ejs 里配合主题布局添加
<% if (theme.gitment){ %><section class="comments" id="comments"> <div id="gitment_thread"></div> <link rel="stylesheet" href="https://imsun.github.io/gitment/style/default.css"> <script src="https://imsun.github.io/gitment/dist/gitment.browser.js"></script> <script> var gitment = new Gitment({ owner: '<%- theme.gitment.owner %>', repo: '<%- theme.gitment.repo %>', oauth: { client_id: '<%- theme.gitment.client_id %>', client_secret: '<%- theme.gitment.client_secret %>', }, }) gitment.render('comments') </script></section><% } %>最后注意 gitment 传回的是 comments 块。
在配置文件里还要加上相关参数
# 开启gitment: owner: repo: client_id: client_secret:测试
经测试,显示完美

收尾
增添功能当然要惠及大家,因此向作者提出 pull request,希望能合并。第一次向开源界贡献一番,值得庆祝
为 Hexo 主题 indigo 添加 gitment 支持
https://blog.ckyol.moe/posts/gitmenthexotheme/分享文章
生成精美分享图或复制链接,与更多人分享本文。
继续阅读
换条路线
从其他文章中稳定抽取
最后更新于 ,距今已过 3417 天
部分内容可能已过时
评论