github+hexo搭建自己的博客网站(五)进阶配置(畅言实现博客的评论)
如何对如何搭建hexo+github可以查看我第一篇入门文章:http://www.cnblogs.com/chengxs/p/7402174.html
详细的可以查看hexo博客的演示:https://saucxs.github.io/
同时绑定了域名:http://www.chengxinsong.cn/
可以查看在github上生成的静态文件:https://github.com/saucxs/saucxs.github.io.git,如果觉得可以请给颗星星。
注意:畅言使用几天之后需要进行实名认证,认证完事之后就可以正常使用。
1、评论实现
在Hexo的Yilia主题由于原来使用的是多说的留言板,近期多说公告要停止提供服务了,所以我就把多说换成搜狐的畅言了,下面写一个简单的小教程。
1.1注册畅言
进入畅言官网 , 点击右上角 “免费注册”,并填写注册信息。(注意域名需要备案信息),之前自己已经注册了一个域名,已经备案,但是还没有到公安局备案,而且那个域名已经在使用,所以直接用那个域名。备案的信息和域名是一一对应的。
1.2绑定域名
绑定域名分2种情况:带www和不带www的。
域名配置最常见有2种方式,CNAME和A记录,CNAME填写域名,A记录填写IP,由于不带www方式只能采用A记录,所以必须先才cmd的ping一下你的用户名.github.io
的IP,然后到你的域名DNS设置页,将A记录指向你ping出来的IP,将CNAME指向你的用户名.github.io
,这样可以保证无论是否添加www都可以访问,如下:
然后到你的github项目根目录新建一个名为CNAME的文件(无后缀),里面填写你的域名,加不加www看你自己喜好,因为经测试:
另外说一句,在你绑定了新域名之后,原来的你的用户名.github.io
并没有失效,而是会自动跳转到你的新域名。
1.3登录并进入畅言后台
注册完后,登录进入畅言官网,获取你的畅言 app id 和 app key。
1.4使用畅言系统
下面说下修改评论为畅言的方法,其实方法和多说是差不多的。
在网上看到别人的教程,发现了问题:多此一举,现在只需要在主题的目录下_config.yml,添加上changyan_appid和changyan_conf的值。
效果:
1.5在github上的github的page上设置域名
1.6如果出现这种情况,在github的page的设置上增加域名。
检查github上的page域名设置地方。
踩得坑:
以下是网上的做法:重复出现评论区
#########################################################################
1、修改 themes\yilia\layout\_partial\article.ejs
模板,把如下代码
也就是如下的代码
<% if (theme.disqus || config.disqus_shortname){ %>
<section id="comments">
<div id="disqus_thread"></div>
<script type="text/javascript">
/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
var disqus_shortname = '<%= theme.disqus || config.disqus_shortname %>'; // required: replace example with your forum shortname /* * * DON'T EDIT BELOW THIS LINE * * */
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
<noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
</section>
<% } %>
换成一下代码
也就是如下代码
<% if (!index && post.comments){ %>
<section id="comments">
<!--高速版,加载速度快,使用前需测试页面的兼容性-->
<div id="SOHUCS" sid="<%= page.title %>"></div>
<script>
(function(){
var appid = 'cytcBy09P',
conf = '0e827330cbbc63a9d87e7ca4c5ded651';
var doc = document,
s = doc.createElement('script'),
h = doc.getElementsByTagName('head')[0] || doc.head || doc.documentElement;
s.type = 'text/javascript';
s.charset = 'utf-8';
s.src = 'http://assets.changyan.sohu.com/upload/changyan.js?conf='+ conf +'&appid=' + appid;
h.insertBefore(s,h.firstChild);
window.SCS_NO_IFRAME = true;
})()
</script>
</section>
<% } %>
上面的APP ID
和APP KEY
是在畅言设置中得到。
这里需要注意一点的是:sid="<%= page.title %>">
这样的话,畅言就可以直接根据对应的文章来识别,使得文章有对应的评论,不会都乱在一起。
2、在每篇文章开头的 front-matter 中添加一句comments: true
,然后回到博客根目录执行命令 hexo d -g
,重新生成博客并部署博客,然后刷新,任选一篇文章进入下拉,会发现评论功能可以使用了。
效果如下:
重复增加了评论部分
####################################################################
github+hexo搭建自己的博客网站(五)进阶配置(畅言实现博客的评论)的更多相关文章
- github+hexo搭建自己的博客网站(六)进阶配置(搜索引擎收录,优化你的url)
详细的可以查看hexo博客的演示:https://saucxs.github.io/ 绑定了域名: http://www.chengxinsong.cn hexo+github博客网站源码(可以clo ...
- github+hexo搭建自己的博客网站(七)注意事项(避免read.me,CNAME文件的覆盖,手动改github page的域名)
详细的可以查看hexo博客的演示:https://saucxs.github.io/ 绑定域名可以查看:http://www.chengxinsong.cn 可以查看在github上生成的静态文件(如 ...
- Github+Hexo,搭建专有博客
前言 记得从大二开始,就一直想搭个专属网站,当时使劲抠页面[前端页面是从QQ空间抠的,现在想抠估计没这么容易了],写代码,忙活半天才把程序弄好. 可惜最终项目还是没上线,因为当时有两问题绕不开 需要购 ...
- 使用GitHub+hexo搭建个人独立博客
前言 使用github pages服务搭建博客的好处有: 全是静态文件,访问速度快: 免费方便,不用花一分钱就可以搭建一个自由的个人博客,不需要服务器不需要后台: 可以随意绑定自己的域名,不仔细看的话 ...
- Linux下使用 github+hexo 搭建个人博客07-next主题接入搜索和站点管理
这是搭建个人博客系统系列文章的最后一篇,如果你是从第一篇一路跟下来的,那么恭喜你,即将完成整个博客网站的搭建.OK,话不多说,开始我们的收官之战. 不知你想过没有,如果我们的文章少,一眼看完整个目录, ...
- Linux下使用 github+hexo 搭建个人博客06-next主题接入数据统计
之前说了 next 主题的优化和接入评论系统.让我们完成了自己所需的页面风格和排版,也可让访问用户在每篇博文评论,完成博主和访问用户的交互. 本章我们继续讲解其他重要功能. 既然是一个网站,那么我们就 ...
- Linux下使用 github+hexo 搭建个人博客05-next主题接入评论系统
静态站点拥有一定的局限性,因此我们需要借助于第三方服务来扩展我们站点的功能. 而评论系统是最常用于和网站用户交流的,因此本章讲解在 next 主题,如何接入评论系统. 参考网站:Next 使用文档,第 ...
- Linux下使用 github+hexo 搭建个人博客04-next主题优化
上篇我们说了 hexo 的优化,针对的站点的优化. 本篇讲解 next 主题的优化,包括:使用语言.前端页面显示宽度.菜单.侧栏.头像.添加或取消动画效果.打赏功能等等. 让页面排版更符合我们所要的功 ...
- Linux下使用 github+hexo 搭建个人博客03-hexo配置优化
上两张文章,我们说了 hexo 部署.主题的切换.博文的创建.MarkDown 简单使用和 hexo 部署到 GitHub Pages. 也说了我们会使用 next 主题做为我们后期博客的使用和维护. ...
随机推荐
- FCKEditor在jsp页面中的配置方法
大家在使用博客园或者是在网站上面发表一些东西的时候,往往会发现,输入文字的不是一个简单的文本框,而是一个类似于word的在线编辑环境.这个插件叫FCKEditor,使用这个插件要进行一定程度的配置,下 ...
- C++ 之 Asio 库
1 简介 Asio 是一个跨平台的 C++ 库,常用于网络编程.底层的 I/O 编程等 (low-level I/O),其结构框架如下: 2 使用 Asio 2.1 下载 Asio 可分为 ...
- 蓝桥杯比赛关于 BFS 算法总结方法以及套路分析
首先我们来看几道java A组的题目,都是同一年的哦!!! 搭积木 小明最近喜欢搭数字积木,一共有10块积木,每个积木上有一个数字,0~9. 搭积木规则:每个积木放到其它两个积木的上面,并且一定比下面 ...
- Docker实践 - 安装Docker并在容器里运行tomcat
安装Docker yum install docker 本文使用的系统是centos7,ubuntu使用以下命令 sudo apt-get update sudo apt-get install do ...
- Javascript DOM 编程艺术———总结-1
第一章: 1.DOM:是一套对文档内容进行抽象和概念化的方法,是一种API. 2.W3C对DOM的定义:一个与系统平台和编程语言无关的借口程序和脚本可以通过这个接口动态的访问和修改文档内容,结构和样式 ...
- PXE+kickstart无人值守安装CentOS 6
本文目录: 1.1 PXE说明 1.2 PXE流程 1.3 部署环境说明 1.4 部署DHCP 1.5 部署TFTP 1.6 提供pxe的bootloader和相关配置文件 1.7 利用原版安装镜像获 ...
- orakill和ALTER SYSTEM KILL SESSION详解
--orakill和ALTER SYSTEM KILL SESSION详解[转]-----------------------------------------2013/11/05 一个用户进程偶尔 ...
- 利用intellijidea创建maven多模块项目
一.项目结构 multi-module-PRoject是主工程,里面包含两个模块(Module): web-app是应用层,用于界面展示,依赖于web-service参的服务. web-service ...
- Random问题
Unity添加C#脚本,打不出来Random.Next,原因是Random自动引用了UnityEngine命名空间,在使用Random的时候要要这么写:System.Random ran=new Ra ...
- 解决若要安装 Microsoft Office 2010,需要MSXML 版本 6.10.1129的问题
单击 开始单击 运行键入 注册表编辑器然后单击 确定. 找到HKEY_CLASSES_ROOT\TypeLib\{F5078F18-C551-11D3-89B9-0000F81FE221}\6.0\0 ...