虽然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评论插件的更多相关文章

  1. hexo博客添加gitalk评论系统

      经过了一天的折腾,我终于为自己的博客添加上了评论系统.坦率的讲,为什么网上那么多方案我还要自己写一篇博客,那就是因为他们说的都有bug,所以我要自己总结一下.   我选用的是gitalk评论系统, ...

  2. 为博客添加 Gitalk 评论插件

    背景 Disqus需要翻墙才能正常使用 畅言有广告 2种评论系统都很难统一管理 优化 使用Gitalk评论插件 , gitalk 使用 Github 帐号登录,界面干净整洁,支持 MarkDown语法 ...

  3. 在个人博客中优雅的使用Gitalk评论插件

    在上一篇博客<程序员如何从0到1搭建自己的技术博客>中,我们了解了如何快速的从0到1搭建一个个人博客. 其实细心的你会发现,该博客用到了一个评论插件,这个插件就是Gitalk. 如果想要在 ...

  4. 如何通过Gitalk评论插件,5分钟为你的博客快速集成评论功能

    欢迎关注个人微信公众号: 小哈学Java, 文末分享阿里 P8 高级架构师吐血总结的 <Java 核心知识整理&面试.pdf>资源链接!! 个人网站: https://www.ex ...

  5. GitHub-Hexo-Blog 集成Gitalk评论插件

    在本文)末尾可查看先查看效果: 1. 新建New OAuth App 在github中,Settings / Develpoer settings OAuth Apps / New OAuth App ...

  6. blog 社会化评论插件 多说for china, disqus for global range

    1.disqus https://disqus.com/ https://publishers.disqus.com/engage https://disqus.com/admin/create/ h ...

  7. 号外号外!解决github+hexo+yilia评论插件的问题!!!

    先走一波效果图!    本人网站--http://www.wenzheng.club/ ps:效果还是不错的,支持QQ微信登录,支持表情,甚至gif动图评论! 插件采用韩国服务器的来必力评论插件--h ...

  8. github+hexo搭建自己的博客网站(二)更换主题yilia

    开始更换主题,hexo默认的主题是landscape,可以更换为其他的主题yilia主题 详细的可以查看hexo博客的演示:saucxs.github.io 可以查看在github上生成的静态文件:h ...

  9. 为 hexo NexT 添加 Gitment 评论插件

    Gitment 是作者imsun实现的一款基于 GitHub Issues 的评论系统. 支持在前端直接引入, 不需要任何后端代码. 可以在页面进行登录, 查看, 评论, 点赞等操作. 同时有完整的 ...

随机推荐

  1. Disconf 分布式配置管理平台(安装配置)

    Disconf 分布式配置管理平台(安装配置) 依赖环境 Nginx:处理静态资源请求.动态请求转发到Tomcat Tomcat:处理Nginx的请求 Redis:用户session管理 MySQL: ...

  2. Ubuntu最常见的包问题

    工作环境换成Ubuntu18.04小记:https://www.cnblogs.com/dunitian/p/9773214.html Ubuntu不得不说的就是这个apt出问题的处理 :(换源就不说 ...

  3. 状态压缩动态规划 状压DP

    总述 状态压缩动态规划,就是我们俗称的状压DP,是利用计算机二进制的性质来描述状态的一种DP方式 很多棋盘问题都运用到了状压,同时,状压也很经常和BFS及DP连用,例题里会给出介绍 有了状态,DP就比 ...

  4. 分布式监控系统开发【day38】:报警阈值程序逻辑解析(三)

    一.需求讨论 1.请问如何解决延迟问题 1000台机器,每1分钟循环一次但是刚好第一次循环第一秒刚处理完了,结果还没等到第二分钟又出问题,你那必须等到第二次循环,假如我这个服务很重要必须实时知道,每次 ...

  5. centos7防火墙设置

    前言 CentOS7 与之前版本在防火墙配置上不同,防火墙从iptables变成了firewalld Centos7默认安装了firewalld,如果没有安装的话,可以使用yum命令进行安装 yum ...

  6. JAVA字符串

    字符串   1. 字符串 1.1 字符串概述和特点 java.lang.String类代表字符串. API当中说:Java 程序中的所有字符串字面值(如 "abc" )都作为此类的 ...

  7. Vim使用技巧:撤销与恢复撤销

    在使用VIM的时候,难免会有输错的情况,这个时候我们应该如何撤销,然后回到输错之前的状态呢?答案:使用u(小写,且在命令模式下)命令. 但如果有时我们一不小心在命令模式下输入了u,然后刚输入的一大片代 ...

  8. oldboy s21day11

    #!/usr/bin/env python# -*- coding:utf-8 -*- # 1.列举 str.list.dict.set 中的常用方法(每种至少5个),并标注是否有返回值.'''str ...

  9. [物理学与PDEs]第1章第2节 预备知识 2.1 Coulomb 定律, 静电场的散度与旋度

    1. Coulomb 定律, 电场强度 (1) 真空中 $P_1$ 处有电荷 $q_1$, $P$ 处有电荷 $q$, ${\bf r}_1=\vec{P_1P}$, 则 $q$ 所受的力为 $$\b ...

  10. 关于缓存和 Chrome 的“新版刷新”

    在读本文前你要确保读过我的上篇文章<扼杀 304,Cache-Control: immutable>,因为本文是接着上文写的.上文说到,在现代 Web 上,“条件请求/304 响应”绝大多 ...