爲Hexo博客添加LiveRe評論系統

注： 本文首發於 My 公衆號 CodeSheep ，可 長按 或 掃描 下面的 當心心 來訂閱 ↓ ↓ ↓

---

---

最近有些網友問我，個人我的博客中的評論系統是怎麼添加的，說實話我都有點忘了，畢竟搞了有好長一段時間了，唉不得不說這個遺忘得真是很快。 今天正好有時間，我就把如何爲本身的Hexo博客添加評論系統寫一篇水文好了。

相信你們看過不少我的博客，用Hexo搭建的博客應該說很流行了，既方便又極具性價比，適合你們本身來動手DIY。

咱們都但願本身的博客具備一個評論系統，一方面用於收集你們的意見來更好的改進，另外一方面評論系統也提供了一個讀者與做者之間交流的平臺。

評論系統能夠說五花八門啦，用得多的好比：暢言、Gitment、Gitalk、LiveRe、Disqus、友言 等等：

暢言：

Gitment：

Gitalk：

LiveRe：

友言：

本文接下來主要闡述如何添加LiveRe做爲博客的評論系統

---

首先註冊並登陸LiveRe

LiveRe註冊地址：https://livere.me/register?lang=zh-cn

註冊之後登陸進去，選擇City版進行安裝，City版是免費的，對咱們這種我的博客而言徹底足夠了

接下來須要填寫一些關於你想將LiveRe用於的博客的一些信息：

填完以後，申請獲取代碼，此時其將會給你一段代碼，該段代碼等下須要加到你的我的博客的頁面中，咱們能夠先將其複製並保存起來：

在我的博客中加入LiveRe代碼

首先去如路徑：hexo_bolg/themes/your-theme/layout/_partial/post下建立livere.ejs代碼。livere.ejs的內容就是上一步中獲取的代碼：

<!-- 來必力City版安裝代碼 -->
<div id="lv-container" data-id="city" data-uid="MTAyMC8zMzM5MC85OTQ2">
	<script type="text/javascript">
   (function(d, s) {
       var j, e = d.getElementsByTagName(s)[0];

       if (typeof LivereTower === 'function') { return; }

       j = d.createElement(s);
       j.src = 'https://cdn-city.livere.com/js/embed.dist.js';
       j.async = true;

       e.parentNode.insertBefore(j, e);
   })(document, 'script');
	</script>
<noscript> 爲正常使用來必力評論功能請激活JavaScript</noscript>
</div>
<!-- City版安裝代碼已完成 -->

而後修改路徑：hexo_bolg/themes/your-theme/layout/_partial下的article.ejs文件，在<% if (!index && post.comments){ %> 代碼塊下添加以下代碼：

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

我再來配一張圖給大家看一下：

此時LiveRe已經添加OK了，從新部署你的博客而後刷新頁面就能夠看到博客中添加好了LiveRe評論系統（好比個人博客：http://www.hansonwang99.com.cn/）：

如何自定義LiveRe的樣式

LiveRe支持多重方式進行登陸，並且其樣式也是能夠自定義的：

能夠去LiveRe的網站的管理頁面中進行設置：

更多好玩的東西你能夠盡情探索，找到你本身喜歡的樣式就能夠啦