安装NexT

下载主题

1
2
$ cd your-hexo-site
$ git clone https://github.com/iissnan/hexo-theme-next themes/next

下载完后在站点目录下的themes目录下，可以看到新生成的next目录。

启用主题

打开站点配置文件，找到theme字段，更改值为next。

Tips：在vi编辑模式下，使用?keyword，搜索文件关键字，使用N(shift+n)跳转下一条，使用n跳转上一条。

image-20230810105037026

主题设定

参考地址：http://theme-next.iissnan.com/getting-started.html#select-scheme

基础设置

在主题目录下，一般会有一个_config.yml主题配置文件，NexT的配置信息大致如下：

  • scheme：主题外观
  • menu：菜单
  • darkmode：暗黑模式
  • social：社交链接
  • footer：页脚
  • scrollpercent：浏览进度
  • codeblock：代码复制按钮

阅读次数、访问量

1
2
3
4
5
6
7
8
busuanzi_count:
  enable: true
  total_visitors: false # 文章底部
  total_visitors_icon: user
  total_views: false # 文章底部
  total_views_icon: eye
  post_views: true # 文章开头展示的阅读量
  post_views_icon: eye

字数统计和阅读时长：（需要安装插件）

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

站点配置文件配置如下：

1
2
3
4
5
6
7
symbols_count_time:
  awl: 2 #平均每个字符的长度
  wpm: 275 # 设定每分钟可阅读的字符数
  symbols: true #是否统计字数
  time: true #是否统计阅读时长
  total_symbols: true #是否统计总字数
  total_time: true #是否统计总阅读时长

主题配置文件配置如下：

1
2
3
4
symbols_count_time:
  separated_meta: true  #分隔线
  item_text_post: true  #文章中的显示是否显示文本
  item_text_total: false #网页底部的显示是否显示文本

设置阅读全文

NexT支持三种方式控制文章在首页的显示方式：

  1. 在文章中使用 <!-- more --> 手动进行截断，Hexo 提供的方式 NexT推荐
  2. 在文章的 front-matter 中添加 description，并提供文章摘录
  3. 自动形成摘要，在 主题配置文件 中添加：
1
2
3
auto_excerpt:
  enable: true
  length: 150 # 默认截取的长度为 150 字符，可以根据需要自行设定

代码块高亮主题

codeblock.highlight_theme

NexT 默认使用的是 白色的 normal 主题，可选的值有 normal，night， night blue， night bright， night eighties.