Hexo搭建博客NexT主题之在线聊天DaoVoice配置

效果图:

使用ThemeNexT主题集成DaoVoice与客户沟通的绝佳工具

1.首先点击DaoVoice到官网注册账号

• 踩坑第一步：点击官网注册账号跳转链接会变。
  

  2. 跳转至DaoCloud页面注册

  

  3. 注册成功后，点击我发出的邀请码或手动输入邀请码：4da49702 进入下一步。

  提示：人数最多不能 >5000人（5000人以上收费）
  

点击创建后，会直接跳转到控制台如图所示：

得到app_id方便操作以下配置主题_config.yml文件中的DaoVoice插件。

配置主题

1.修改head.swig

修改/themes/next/layout/_partials/head.swig文件，添加内容（直接复制即可）如下：

代码如下：

{% if theme.daovoice %}
  <script>
  (function(i,s,o,g,r,a,m){i["DaoVoiceObject"]=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;a.charset="utf-8";m.parentNode.insertBefore(a,m)})(window,document,"script",('https:' == document.location.protocol ? 'https:' : 'http:') + "//widget.daovoice.io/widget/0f81ff2f.js","daovoice")
  daovoice('init', {
      app_id: "{{theme.daovoice_app_id}}"
    });
  daovoice('update');
  </script>
{% endif %}

2. 主题配置文件

在_config.yml文件（必须）末尾添加内容：

# Online contact                     
daovoice: true
daovoice_app_id: 这里输入前面获取的app_id

3.由于NexT主题更新该配置DaoVoice方法 故针对NexT 7.5.0版本主题

1. 路径相同，需要这样修改head.swig文件内容,代码尽量插入到该段中间。

代码如下：

{%- if theme.daovoice %}
  <script>
  (function(i,s,o,g,r,a,m){i["DaoVoiceObject"]=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;a.charset="utf-8";m.parentNode.insertBefore(a,m)})(window,document,"script",('https:' == document.location.protocol ? 'https:' : 'http:') + "//widget.daovoice.io/widget/0f81ff2f.js","daovoice")
  daovoice('init', {
      app_id: "{{theme.daovoice_app_id}}"
    });
  daovoice('update');
  </script>
{%- endif %}

Over Ending（结束语）

DaoVoice配置告一段落，其余的DaoVoice控制台窗口大小、颜色、图标……etc自己去探索吧!

注:

如果还有不了解的，可以在右下方与博主在线沟通