Hexo-Next搭建个人博客（集成LiveRe来必力文章评论功能）

发表于 | 更新于 | 分类于 | 阅读次数：
本文字数： 1.6k | 阅读时长 ≈ 2 分钟
由于众所周知的原因，多说评论和网易云跟帖先后都宣布关闭评论服务，一直没有找到好的替换方案。昨天无意看到韩国的Livere（来必力）评论，瞬间就喜欢上了~UI好看，加载时候的那个小幽灵也好可爱=w=而且是国外的，应该没那么容易关闭吧2333下面记录一下步骤~


准备

  1. 去Livere官网注册Livere账号。
  2. 选择City版（免费），安装
  3. 进入管理页面->代码管理->一般网站，复制data-uid

在Hexo中添加Livere

以下基于主题Next，其他主题做法类似

  1. 打开博客根目录/themes/next/_config.yml

  2. 将# Third Party Services Settings 栏目下其他评论系统如duoshuo、gentie、youyan、disqus用#注释掉，加入以下内容

    1
    2
    # Livere评论系统
        livere_uid: 上一步中你获取的data-uid

  3. 在博客根目录/themes/layout/_scripts/third-party/comments/目录中新建txt文件，重命名为livere.swig，编辑内容如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
{% if not (theme.duoshuo and theme.duoshuo.shortname) and not theme.duoshuo_shortname and not theme.disqus_shortname and not theme.hypercomments_id and not theme.gentie_productKey %}
  {% if theme.livere_uid %}
    <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>
  {% endif %}
{% endif %}

  1. 在博客根目录/themes/layout/_scripts/third-party/comments.swig文件中追加：

    1
    {% include './comments/livere.swig' %}

  2. 在博客根目录/themes/layout/_partials/comments.swig文件中条件最后追加 LiveRe 插件是否引用的判断逻辑：

    1
    2
    3
    {% elseif theme.livere_uid %}
          <div id="lv-container" data-id="city" data-uid="{{ theme.livere_uid }}"></div>
    {% endif %}

重新hexo clean、hexo d -g，然后就可以看到来必力评论啦~

ps:因为是国外的，评论加载有点慢。

效果图

如果你觉得这篇文章对你有用，欢迎赞赏哦~
本文结束啦 感谢您阅读
0%