Hexo主题yilia增加gitalk评论插件
虽然gitment可以实现评论功能,但是适配方面做的并不好,这里借用GitHub上的gitalk项目用来优化个人博客的评论功能
下面记录自己从gitment到gitalk的替换过程:
1.在layout/_partial/post目录下新增gitalk.ejs文件
代码如下:
<div id="gitalk-container" style="padding: 0px 30px 0px 30px;"></div>
<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"></script>
<script type="text/javascript">
if(<%=theme.gitalk.enable%>){
var gitalk = new Gitalk({
clientID: '<%=theme.gitalk.ClientID%>',
clientSecret: '<%=theme.gitalk.ClientSecret%>',
repo: '<%=theme.gitalk.repo%>',
owner: '<%=theme.gitalk.githubID%>',
admin: ['<%=theme.gitalk.adminUser%>'],
id: '<%= page.date %>',
distractionFreeMode: '<%=theme.gitalk.distractionFreeMode%>'
})
gitalk.render('gitalk-container')
}
</script>
2.修改source-src/css/目录下comment.scss文件
代码如下:
#disqus_thread, .duoshuo, .cloud-tie-wrapper, #SOHUCS, #gitment-ctn, #gitalk-container {
padding: 0 30px !important;
min-height: 20px;
}
#SOHUCS {
#SOHU_MAIN .module-cmt-list .block-cont-gw {
border-bottom: 1px dashed #c8c8c8 !important;
}
}
3.在layout/_partial目录下的article.ejs文件内新增gitalk相关的配置代码:
代码如下:
<% if(theme.gitalk.enable){ %>
<%- partial('post/gitalk', {
key: post.slug,
title: post.title,
url: config.url+url_for(post.path)
}) %>
<% } %>
4.在yilia主题配置文件(_config.yml)中新增gitalk相关的配置:
代码如下:
gitalk:
enable: true #是否开启
githubID: liu1340308350 #你的Github用户名
repo: liu1340308350.github.io #Github仓库名称
ClientID: d59609200a63b0ee33de #创建的Application ClientID
ClientSecret: d5eb433efa8075a46a3c6ec2744212acdb1ab01e #创建的Application ClientSecret
adminUser: liu1340308350 # 评论初始化账户(GitHub ID)
distractionFreeMode: true # 是否开启分心自由模式 也就是免打扰
记得把gitment的配置注释掉
5.提交更新
hexo d -g
故障:
提交之后gitalk的评论页面出现在主页,最后反复提交2次之后,主页的gitalk评论页面消失,这里十分迷惑,求解?
我的博客,欢迎博友查看
Hexo主题yilia增加gitalk评论插件的更多相关文章
- hexo博客添加gitalk评论系统
经过了一天的折腾,我终于为自己的博客添加上了评论系统.坦率的讲,为什么网上那么多方案我还要自己写一篇博客,那就是因为他们说的都有bug,所以我要自己总结一下. 我选用的是gitalk评论系统, ...
- 为博客添加 Gitalk 评论插件
背景 Disqus需要翻墙才能正常使用 畅言有广告 2种评论系统都很难统一管理 优化 使用Gitalk评论插件 , gitalk 使用 Github 帐号登录,界面干净整洁,支持 MarkDown语法 ...
- 在个人博客中优雅的使用Gitalk评论插件
在上一篇博客<程序员如何从0到1搭建自己的技术博客>中,我们了解了如何快速的从0到1搭建一个个人博客. 其实细心的你会发现,该博客用到了一个评论插件,这个插件就是Gitalk. 如果想要在 ...
- 如何通过Gitalk评论插件,5分钟为你的博客快速集成评论功能
欢迎关注个人微信公众号: 小哈学Java, 文末分享阿里 P8 高级架构师吐血总结的 <Java 核心知识整理&面试.pdf>资源链接!! 个人网站: https://www.ex ...
- GitHub-Hexo-Blog 集成Gitalk评论插件
在本文)末尾可查看先查看效果: 1. 新建New OAuth App 在github中,Settings / Develpoer settings OAuth Apps / New OAuth App ...
- blog 社会化评论插件 多说for china, disqus for global range
1.disqus https://disqus.com/ https://publishers.disqus.com/engage https://disqus.com/admin/create/ h ...
- 号外号外!解决github+hexo+yilia评论插件的问题!!!
先走一波效果图! 本人网站--http://www.wenzheng.club/ ps:效果还是不错的,支持QQ微信登录,支持表情,甚至gif动图评论! 插件采用韩国服务器的来必力评论插件--h ...
- github+hexo搭建自己的博客网站(二)更换主题yilia
开始更换主题,hexo默认的主题是landscape,可以更换为其他的主题yilia主题 详细的可以查看hexo博客的演示:saucxs.github.io 可以查看在github上生成的静态文件:h ...
- 为 hexo NexT 添加 Gitment 评论插件
Gitment 是作者imsun实现的一款基于 GitHub Issues 的评论系统. 支持在前端直接引入, 不需要任何后端代码. 可以在页面进行登录, 查看, 评论, 点赞等操作. 同时有完整的 ...
随机推荐
- Django_rbac_demo 权限控制组件框架模型
rbac 权限控制组件 基于角色的权限控制 本质每个权限即为一个 URL 项目组件结构 表结构 Role (title, permission) -(ManyToManyField)- User ...
- Hdoj 2149.Public Sale 题解
Problem Description 虽然不想,但是现实总归是现实,Lele始终没有逃过退学的命运,因为他没有拿到奖学金.现在等待他的,就是像FarmJohn一样的农田生涯. 要种田得有田才行,Le ...
- 一个故事讲清楚BIO NIO 异步
转载请引用:一个故事讲清楚NIO 假设某银行只有10个职员.该银行的业务流程分为以下4个步骤: 1) 顾客填申请表(5分钟): 2) 职员审核(1分钟): 3) 职员叫保安去金库取钱(3分钟): 4) ...
- windows上编译zlib-1.2.8
MSVC编译 使用VS(x86)命令行工具进入到zlib根目录,执行 nmake -f win32/Makefile.msc ,在根目录下生成:zlib.lib(静态库) zdll.lib(动态库的 ...
- crm 动态一级二级菜单
之前代码菜单是写是的 如何 让他 动态 生成了 首先 添加 2个字段 admin.py 更改 显示 from django.contrib import admin from rbac import ...
- CentOS7.2 设置静态ip
先找到配置文件: [root@localhost bin]# cd /etc/sysconfig/network-scripts [root@localhost network-scripts]# l ...
- LFYZ-OJ ID: 1017 士兵站队问题
分析 该题和"输油管道问题"类似,只不过由一维问题编程了二维问题.可以将总步数分解为移动到水平线y位置的总步数ysteps和移动到序列x, x+1, x+2, ... , x+n- ...
- 已知 $AB$, 求 $BA$
设 $A,B$ 分别是 $3\times 2$ 和 $2\times 3$ 实矩阵. 若 $\dps{AB=\sex{\ba{ccc} 8&0&-4\\ -\frac{3}{2}& ...
- Idea 创建控制台程序
1:前提配置好 jdk环境. 最后一步:填写项目名称和保存的路径 即可.
- Illegal invocation with document.querySelector [duplicate]
document.querySelectorAll赋给其它变量时, 为什么要.bind(document)? https://stackoverflow.com/questions/12637061/ ...