默认主题 landscape
文件目录,comments为新建的
_config.yml layout -- _partial -- article.ejs |- comments -- disqus.ejs |- duoshuo.ejs |- youyan.ejs
注册评论系统:
Disqus 注册 设置Shortname
多说 不用注册直接登录(例如用百度账号),设置域名
友言 注册,查看ID
1 修改主题配置文件 landscape/_config.yml 添加以下内容:
# >>> Conments 评论系统 <<< # Chose ONE as your comment system and keep others disable. # 选一个作为网站评论系统,其他保持禁用。 disqus: on: true shortname: yourshortname # https://help.disqus.com/customer/en/portal/articles/466208-what-s-a-shortname- # It is unnecessary to enable disqus here if # you have set "disqus_shortname" in your site's "_config.yml" duoshuo: #on: true domain: yourdomain # 是否开启多说评论,http://duoshuo.com/create-site/ # 使用上面网址登陆你的多说,然后创建站点,在 domain 中填入你设定的域名 # http://你的多说域名.duoshuo.com youyan: #on: true id: yourID # 是否开启友言评论,http://www.uyan.cc/index.php # id 中填写你的友言用户数字ID,注册后进入后台管理即可查看 # 友言服务在 Web 环境下运行,普通本地环境无法查看,请部署后在线上测试。 # >>> <<<
2 修改 article.ejs 添加:
<% if (!index && post.comments){ %> <% if (theme.duoshuo.on) { %> <%- partial('comments/duoshuo', { key: post.path, title: post.title, url: config.url+url_for(post.path), }) %> <% } else if (theme.youyan.on) { %> <%- partial('comments/youyan') %> <% } else if (theme.disqus.on) { %> <%- partial('comments/disqus', { shortname: theme.disqus.shortname }) %> <% } else if (config.disqus_shortname) { %> <%- partial('comments/disqus', { shortname: config.disqus_shortname }) %> <% } %> <% } %>
3 在comments目录下新建3个文件:disqus.ejs、duoshuo.ejs、youyuan.ejs
# disqus.ejs
<section id="comments"> <div id="disqus_thread"></div> <script type="text/javascript"> /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */ var disqus_shortname = '<%= 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>
# duoshuo.ejs
<div class="duoshuo" id="comments"> <!-- 多说评论框 start --> <div class="ds-thread" data-thread-key="<%=key%>" data-title="<%=title%>" data-url="<%=url%>"></div> <!-- 多说评论框 end --> <!-- 多说公共JS代码 start (一个网页只需插入一次) --> <script type="text/javascript"> var duoshuoQuery = {short_name:"<%=theme.duoshuo.domain%>"}; (function() { var ds = document.createElement('script'); ds.type = 'text/javascript';ds.async = true; ds.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//static.duoshuo.com/embed.js'; ds.charset = 'UTF-8'; (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(ds); })(); </script> <!-- 多说公共JS代码 end --> </div>
# youyuan.ejs
<section class="youyan" id="comments"> <div id="uyan_frame"></div> <script src="http://v2.uyan.cc/code/uyan.js?uid=<%= theme.youyan.id%>"></script> </section>
配置完成,可以自由选择使用一种评论系统了!效果如下:
对于maupassant主题,已经自带了disqus、多说 评论系统,只需要在maupassant/_config.yml中开启即可