title: 接入gitment为hexo添加评论功能

toc: false

date: 2018-04-16 10:59:56

categories:

  • methods

tags:

  • hexo
  • gitment

注册一个OAuth application

注册链接

其中:

Application name 为应用名,取一个跟自己博客相关的名字即可;

Homepage URL 为博客地址,例如我的为:https://mikqueenge.github.io

Application description 为应用描述,可不填;

Authorization callback URL 为回调URL,可不填;

点击 Register application 祝成功后会得到这个应用的 client IDclient secret,等下配置文件时会用到。

配置文件

主题:landscape

创建git.ejs

themes/landscape/layout/_partial/post文件夹中创建文件git.ejs,写入下面的代码:

<!-- Gitment评论插件通用代码 -->
<div id="git"></div>
<!-- 汉化版 -->
<link rel="stylesheet" href="https://billts.site/extra_css/gitment.css">
<script src="https://billts.site/js/gitment.js"></script>
<script>
var gitment = new Gitment({
id: '{{ page.date }}', //添加此句解决Error:validation failed的问题
owner: "%%%%%%%",//github用户名,例如MIKQUEENGE
repo: "%%%%%%%",//用户存储评论的github项目名称,例如MIKQUEENGE.github.io
oauth: {
client_id: "%%%%%%%%%%%%",//注册OAuth Application时生产的ClinetID
client_secret:"%%%%%%%%%%",//注册OAuth Application时生成的Client Secret
},
})
gitment.render('git')
</script>
<!-- Gitment代码结束 -->

配置article.ejs

themes/landscape/layout/_partial/article.ejs文件的结尾添加:

<% if (!index){ %>
<% if (post.comments){ %>
<%- partial('post/git') %>
<% } else { %>
<div class="git"></div>
<% } %>
<% } %>

登陆与添加评论

完成上述配置后部署并打开某篇文章,拉到最底部可以看到评论区:

点击登陆后就可以添加评论啦!

遇到问题Error:validation failed

md文件名太长导致id出现问题,使用上述代码是不会出现这个问题的。

如果出现这个问题,解决方案为在gitment配置文件(如上述的git.ejs)中的var gitment = new Gitment({})内添加id: '{{ page.date }}',(不要忘记这个逗号)


参考链接:

Hexo博客yelee主题添加Gitment评论系统

Gitment评论功能接入踩坑教程

接入gitment为hexo添加评论功能的更多相关文章

  1. sharepoint 2010 如何给文档库或自定义列表添加评论功能

    转:http://www.cfanz.cn/?c=article&a=read&id=40924 最近公司在知识库中,有一个需求,就是想要给文档添加评论功能,在sharepoint 2 ...

  2. SharePoint 2007 文档库中的文档添加评论功能

    背景:接到一个项目,要求文档管理,当然文档库就可以了,但是要求文档需要大家去读,读完以后还可以发表评论,这Moss貌似就有点困难了.和同事一起合计,想来想去也没有太好的办法,后来想到传统开发,两个表的 ...

  3. 给hexo添加评论系统

    默认主题 landscape 文件目录,comments为新建的 _config.yml layout -- _partial -- article.ejs |- comments -- disqus ...

  4. 【干货】2个小时教你hexo博客添加评论、打赏、RSS等功能 (转)

    备注:该教程基于Hexo 2.x版本,目前Hexo是3.x版本,照本教程实现有可能会出现404错误,笔者目前还未找时间去解决,待笔者找时间解决该问题后,再写一篇该问题的解决教程,给各位读者带来困扰,还 ...

  5. Hexo瞎折腾系列(8) - 添加评论系统

    前言 Hexo的NexT主题本身就集成了一些评论系统,多说啊之类的已经关闭服务的略过不提,目前比较多人用的有畅言.来必力livere.Gitment.Gitalk.Disqus等. 我刚用的评论系统的 ...

  6. 将hexo的评论系统由gitment改为Valine

    title: 将hexo的评论系统由gitment改为Valine toc: false date: 2018-09-13 15:10:56 categories: methods tags: hex ...

  7. 在Jekyll博客添加评论系统:gitment篇

    最近在Github Pages上使用Jekyll搭建了个人博客( jacobpan3g.github.io/cn ), 当需要添加评论系统时,找了一下国内的几个第三方评论系统,如"多说&qu ...

  8. hexo next主题为博客添加分享功能

    title: hexo next主题为博客添加分享功能 date: 2018-01-06 20:20:02 tags: [hexo博客, 博客配置] categories: hexo next主题配置 ...

  9. 一步步搭建自己的博客 .NET版(2、评论功能)

    前言 这次开发的博客主要功能或特点:    第一:可以兼容各终端,特别是手机端.    第二:到时会用到大量html5,炫啊.    第三:导入博客园的精华文章,并做分类.(不要封我)    第四:做 ...

随机推荐

  1. ROS-动态参数

    前言:在节点外部改变参数的方式有:参数服务器.服务.主题以及动态参数. 1.新建cfg文件 在chapter2_tutorials包下新建cfg文件夹,在cfg文件夹下新建chapter2.cfg文件 ...

  2. redis的持久化功能

    基于快照持久化 修改配置文件,开始基于快照的选项 [root@localhostbin]#vim /etc/redis/redis.conf stop-writes-on-bgsave-error y ...

  3. 洛谷P3358 最长k可重区间集问题(费用流)

    题目描述 对于给定的开区间集合 I 和正整数 k,计算开区间集合 I 的最长 k可重区间集的长度. 输入输出格式 输入格式: 的第 1 行有 2 个正整数 n和 k,分别表示开区间的个数和开区间的可重 ...

  4. (转载)Android项目实战(二十八):Zxing二维码实现及优化

    Android项目实战(二十八):Zxing二维码实现及优化   前言: 多年之前接触过zxing实现二维码,没想到今日项目中再此使用竟然使用的还是zxing,百度之,竟是如此牛的玩意. 当然,项目中 ...

  5. Custom Hosting in IIS/WAS

    常常需要与宿主实例进行交互.这对于使用自托管的方式是不可或缺的.当使用IIS或WAS时,不能直接访问宿主.为了克服这个障碍,WCF提供了一个宿主工厂.在.svc文件中使用Factory标签,使用此工厂 ...

  6. 给大家介绍几个常见的Android代码片段

    今天在源码天堂那个网站,也下载了一个不错的Android源码特效,现在分享一下给博客园的朋友吧,个人觉得那个网站还是挺不错的,希望大家能够使用得上. 仿美图秀秀拼图功能源码 仿美图秀秀拼图功能源码,最 ...

  7. 【AnjularJS系列4 】 — 单个页面加载多个ng-App

    第四篇,插播, 单个页面加载多个ng-App 在写范例的时候发现的问题 一个页面有多个ng-app,angular只会处理第一个ng-app 需要加载两个ng-app,需要进行手动加载: angula ...

  8. 5G商用时代来临!这些产业将发生变革

    5G商用时代来临!这些产业将发生变革 值得注意的是,在获得工信部发放的5G网络试验频率后,三大运营商已在各大城市建设5G基站,开展5G外场测试.华为亦适时表示,已经在中国40多个城市与中国三大运营商开 ...

  9. debian 9 添加源

    1.将下面内容的添加入/etc/apt/sources.list(香港镜像) #For software deb http://mirrors.ustc.edu.cn/debian/ stretch ...

  10. python3编写登录接口

    #/usr/bin/env python#yehui'''作业一:博客 作业二:编写登陆接口 输入用户名密码 认证成功后显示欢迎信息 输错三次后锁定'''import getpass, os, pic ...