Next主题设置-安装Valine和Artitalk

更新于 阅读次数： Valine：

安装评论valine

  1. 注册Leancloud，建议选择国际版。Leancloud既能管理评论，也能统计阅读情况。在创建的应用里点击数据存储-结构化数据-创建Class，点击创建Class，新建名为Comment，选择无限制，其它默认，然后点击创建，用来查看评论。
    再在数据存储-结构化数据-创建Class，点击创建Class，新建名为Counter，选择无限制，其它默认，用来统计阅读。
  2. next主题没有自带valine评论，安装：npm install next-theme/hexo-next-valine。valine相关文件会下载至Hexo\node_modules\hexo-next-valine，打开该文件夹里的default.yaml，全部复制，粘贴到主题配置文件里。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
valine:
  enable: true
  appId:  #你的leancloud里面的AppID
  appKey:  #你的leancloud里面的AppKey
  serverURLs:  #REST API服务器地址 https://。。。。 # When the custom domain name is enabled, fill it in here
  placeholder: Just go go # Comment box placeholder
  avatar: mm # gravatar style
  meta: [nick, mail, link] # Custom comment header
  pageSize: 10 # pagination size
  lang: # Language, available values: en, zh-cn
  visitor: true #文章阅读量统计  
  comment_count: true # If false, comment count will only be displayed in post page, not in home page 评论计数
  recordIP: true # Whether to record the commenter IP
  enableQQ: true
  requiredFields: [] # Set required fields: [nick] | [nick, mail]
  1. 在Leancloud设置-应用凭证里复制AppID和AppKey，粘贴到appId和appKey，注意冒号后面有空格，并且不要和#连着。
    在设置-安全中心-Web安全域名里添加自己的网址。其余按需修改。
    注意，如果出现Code 401: 未经授权的操作,请检查你的AppId和AppKey，会发现有评论框但是不能提交评论。在设置-应用凭证里复制REST API 服务器地址，粘贴到serverURLs:，即可解决。
  2. 主题配置里自带leancloud的阅读统计功能。如果启用，其中app_id: app_key: server_url:按照valine里的填写。
1
2
3
4
5
6
leancloud_visitors:
  enable: 
  app_id:   
  app_key:  
  server_url: 
  security: true
  1. valine、leancloud和busuanzi的统计有冲突，建议如下设置：
1
2
3
valine:
  enable: true
  visitor: false  // 关闭
1
2
leancloud_visitors: 
  enable: true //打开
1
2
3
4
5
6
7
8
busuanzi_count:
  enable: true
  total_visitors: true
  total_visitors_icon: fa fa-user
  total_views: true
  total_views_icon: fa fa-eye
  post_views: false  # 关闭
  post_views_icon: far fa-eye
  1. 如果在阅读统计中出现Counter not initialized! More info at console err msg.，设置leancloud_visitors.security = false，如下：
1
2
3
leancloud_visitors: 
  enable: true    # 必须开
  security: false

添加Artitalk说说

Next主题还没有添加Artitalk，需要用到Leancloud。在安装Valine评论系统时，已经注册了Leancloud国际版，在leancloud里的创建操作，请参考Artitalk官网，从这里开始，按照以下步骤。

  1. 一般是在侧栏上方菜单里添加说说，在Hexo\source下新建文件夹shuoshuo，在Hexo\source\shuoshuo里新建文件index.md，修改title、type等，添加以下内容：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
---
title:  #为了标题中出现，可以不填
type: "shuoshuo" #必须有
comments: false # 是否再下方显示评论栏 
---

<!-- 引用 artitalk -->
<script type="text/javascript" src="https://unpkg.com/artitalk"></script>
<!-- 存放说说的容器 -->
<div id="artitalk_main"></div>
<script>
new Artitalk({
    appId: '', // Your LeanCloud appId
    appKey: '', // Your LeanCloud appKey
    pageSize: 50, //每页评论数量
    shuoPla: '', //评论框里显示，可以不填
    motion: 0, //加载动画的开关 0（关闭），1（开启）
    atComment: 1, //评论功能的开关 0（关闭），1（开启）
    bgImg: '', //评论框里的背景，可以不填
    color1: 'linear-gradient(102.7deg, #fddaff 8.2%, #dfadfc 19.6%, #adcdfc 36.8%, #adfcf4 73.2%, #caf8d0 90.9%)', //自定义颜色，有几种方式
    color2: 'linear-gradient(50deg, rgb(30,227,207) 10%, rgb(249,188,221) 90%)',
    color3: '#3b9a9c',
})
</script>
  1. 更多颜色，可以参考颜色1、颜色2。
  2. 在themes\next\languages\zh-CN里添加shuoshuo的翻译，可以是说说、闲言碎语、碎碎念等。

重要：由于Artitalk与Pjax存在冲突，需要手动刷新说说页面，或者在新标签页打开才能显示。可以关闭pjax，在主题配置里修改为pjax: false，不过对网页运行有一点影响。
也可以直接在文章里添加说说，这样就可以在不关闭Pjax的情况下，使用window.open()，在新标签页打开说说，相当于刷新了说说的网页。

1
<a onclick="window.open('https://satparamita.top/about/%E9%9F%B3%E4%B9%90.html', '_blank');"></a>