給hexo添加評論系統



 默認主題 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中開啟即可

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM