给 Hexo 博客添加评论插件

安装评论插件

进入畅言后台注册

ps: 国内用户推荐

http://changyan.kuaizhan.com/

注册过程要提供网站信息, 域名和网站名称等. 还要讲信任域名加入其中.

之后获取到 appid 和 app key

进入 Disqus 后台

ps: 国外用户推荐

https://disqus.com/

一样要提供网站的相关信息, 之后添加信任域名. 与畅言类似, 但是要手动操作不会有引导.

之后获取到 short name

配置后台参数

二者选其一即可, 不选的配置留空.

_config.yml

# Changyan Comments

changyan:
appid: ##这里填写畅言后台的 appid##
config: ##这里填写畅言后台的 appkey##

# Disqus Comments

disqus_shortname: ##这里填写 Disqus 后台的 short name##

配置模板

在文章模板合适位置(我放在最下方)插入如下代码:

layout/_partial/post/article.ejs

<% if(post.comments){ %>
<section id="comments">
<% if (config.changyan.appid){ %>
<%- partial('\_widget/changyan') %>
<% }else if(config.disqus_shortname){ %>
<%- partial('\_widget/disqus') %>
<% } %>
</section>
<% } %>

增加畅言插件文件:

layout/_widget/changyan.ejs

<!-- changyan start -->
<div id="SOHUCS" sid="<%= post.date %>" ></div>
<script type="text/javascript">
(function(){
var appid = '<%= config.changyan.appid %>';
var conf = '<%= config.changyan.config %>';
var width = window.innerWidth || document.documentElement.clientWidth;
if (width < 960) {
window.document.write('<script id="changyan_mobile_js" charset="utf-8" type="text/javascript" src="http://changyan.sohu.com/upload/mobile/wap-js/changyan_mobile.js?client_id=' + appid + '&conf=' + conf + '"><\/script>'); } else { var loadJs=function(d,a){var c=document.getElementsByTagName("head")[0]||document.head||document.documentElement;var b=document.createElement("script");b.setAttribute("type","text/javascript");b.setAttribute("charset","UTF-8");b.setAttribute("src",d);if(typeof a==="function"){if(window.attachEvent){b.onreadystatechange=function(){var e=b.readyState;if(e==="loaded"||e==="complete"){b.onreadystatechange=null;a()}}}else{b.onload=a}}c.appendChild(b)};loadJs("http://changyan.sohu.com/upload/changyan.js",function(){window.changyan.api.config({appid:appid,conf:conf})}); } })(); </script>
<!-- changyan end -->

增加 Disqus 插件文件:

layout/_widget/changyan.ejs

<!-- disqus start -->
<div id="disqus_thread"></div>
<script type="text/javascript">
<!-- following code is copied form hexo theme Next, thanks a lot -->
var disqus_shortname = '<%= config.disqus_shortname %>';
var disqus_identifier = '<%= page.path %>';
var disqus_title = '<%= page.title %>';
function run_disqus_script(disqus_script) {
	var dsq = document.createElement('script');
	dsq.type = 'text/javascript';
	dsq.async = true;
	dsq.src = '//' + disqus_shortname + '.disqus.com/' + disqus_script;
	(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
}
run_disqus_script('count.js');
<% if (page.comments) { %>
var disqus_config = function () {
    this.page.url = disqus_url;
    this.page.identifier = disqus_identifier;
    this.page.title = disqus_title;
};
run_disqus_script('embed.js');
<%}%>
</script>
<noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
<!-- disqus end -->