Hexo+Next搭建个人博客 （添加网站统计分析功能）

前言

最近将博客从 Jekyll 迁移到 Hexo，在迁移的过程中也遇到一些问题，下面就简单记录一下 Hexo+NexT+Github Pages 的搭建步骤。

在上一章，我们已经集成 DaoVoice 在线联系功能，本章，我们将设置网站统计分析

添加网站统计

Google 分析

新建 Google 分析 账号

首先进入 Google 分析 创建账号,如下

创建分析应用

创建完成后，我们依次点击页面左下角 设置 -> 跟踪信息 -> 跟踪代码 获取跟踪 ID

配置 NexT 主题

打开 主题配置文件 ，搜索 google_analytics 关键字，设置如下

script

# Google Analytics
google_analytics:
  tracking_id: # 你的跟踪代码
  # By default, NexT will load an external gtag.js script on your site.
  # If you only need the pageview feature, set the following option to true to get a better performance.
  only_pageview: false

百度统计

获取统计代码

首先我们登录 百度统计

添加网站

添加完成后，点击获取代码

红框部分就是我们需要的统计代码

配置 NexT 主题

打开 主题配置文件 ，搜索 baidu_analytics 关键字，设置如下

script

# Baidu Analytics
baidu_analytics: # 你的 app_id

不算子统计

不算子官网

NexT 中已经为我们集成了不算子统计的代码，我们只需在NexT配置文件中开启即可

打开 主题配置文件 ，搜索 busuanzi_count 关键字，设置如下

script

# Show Views / Visitors of the website / page with busuanzi.
# Get more information on http://ibruce.info/2015/04/04/busuanzi
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: fa fa-eye

CNZZ 友盟统计

获取统计代码

首先我们登录 友盟+

点击 添加 Web 添加一个网站

添加完成后复制红框中的值

配置 NexT 主题

打开 主题配置文件 ，搜索 cnzz_siteid 关键字，设置如下

script

# CNZZ count
cnzz_siteid: # 你的站点id

添加字数统计和预计阅读时长

在站点根目录下打开 git bash ，输入以下命令安装 hexo-symbols-count-time 插件

script

$ npm install hexo-symbols-count-time --save

打开 主题配置文件 ，搜索 symbols_count_time 关键字，设置如下

script

# Post wordcount display settings
# Dependencies: https://github.com/theme-next/hexo-symbols-count-time
symbols_count_time:
  symbols: true
  time: true
  total_symbols: true
  total_time: true
  exclude_codeblock: false
  awl: 4
  wpm: 275
  suffix: "mins."

添加文章阅读量统计

注：文章阅读量统计可以按照自己喜好选择其中一个便可

Firebase 文章阅读量统计

获取参数

Firebase 是基于 Google 账号的，所以可以直接用 Google 账号，我们先创建一个项目

创建完成后点击下图所示位置获取apiKey和projectId

下图红框圈中的地方就是你的apiKey和projectId

配置 NexT 主题

打开 主题配置文件 ，搜索 firestore 关键字，设置如下

script

# Another tool to show number of visitors to each article.
# Visit https://console.firebase.google.com/u/0/ to get apiKey and projectId.
# Visit https://firebase.google.com/docs/firestore/ to get more information about firestore.
firestore:
  enable: true
  collection: articles # Required, a string collection name to access firestore database
  apiKey: # 你的 apiKey
  projectId: # 你的 projectId

Leancloud

如果是文章评论选择使用 Valine 插件的用户，可以直接把 valine.visitor 这个参数设置为 true 即可

注册 LeanCloud 账号，注册完成后，我们找到创建应用

在这里填写你的应用名称,名称可以自己定义，然后下面选择 开发版 点击 创建。

然后点击应用进入设置

在设置页，我们首先点击存储，查看是否有 Counter 表，没有则创建，权限设为无限制。

然后点击设置 > 安全中心 ,将除了数据存储的服务全部关闭。

最后点击 应用 Keys 取得我们 AppKey 和 App id

配置 NexT 主题

打开 主题配置文件 ，搜索 leancloud_visitors 关键字，设置如下

script

# Show number of visitors of each article.
# You can visit https://leancloud.cn to get AppID and AppKey.
# AppID and AppKey are recommended to be the same as valine's for counter compatibility.
# Do not enable both `valine.visitor` and `leancloud_visitors`.
leancloud_visitors:
  enable: true
  app_id: # 获取的 App id
  app_key: # 获取的 AppKey
  # Required for apps from CN region
  server_url: # <your server url>
  # Dependencies: https://github.com/theme-next/hexo-leancloud-counter-security
  # If you don't care about security in leancloud counter and just want to use it directly
  # (without hexo-leancloud-counter-security plugin), set `security` to `false`.
  security: true