介绍

NexT是Hexo的知名第三方主题，黑白极简风格四合一，有相当多的使用者，维护也相当给力，数年来一直都在频繁更新。但是最近搜索NexT, 却发现在之前的github仓库theme-next/hexo-theme-next之外，又出现一个新的仓库next-theme/hexo-theme-next，theme-next vs next-theme，难道是个李鬼？

但是查看作者竟然也是大神stevenjoezhang。stevenjoezhang是北大高材生，在theme-next 7.x版本前已经贡献了13万行代码，比项目的owner ivan-nginx多了10万行。

现在主要贡献者竟然另建了一个项目，从v8.0开始另起炉灶，似乎有点不比寻常。翻了翻大神的博客，竟然没有提到片语，查看项目的Issue讨论区，终于发现了端倪：

前排吃瓜走起…… 不管怎样，作为中国人，当然还是要追随大神脚步，使用新的repository。
八卦结束，安装和配置就比较简单了，这里只记录了我用到的很少一部分功能，详细配置可以参考官方文档。

安装

Clone NextT 到 themes文件夹下

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

在hexo配置文件中修改themes为next

1	theme: next

配置

代码高亮

从v7..7.2开始NexT原生支持暗黑模式，代码高亮也可以针对light和dark模式分别设置。现在两个模式设置相同的高亮theme会报错，可能是个bug。

codeblock:
  # Code Highlight theme
  # See: https://github.com/highlightjs/highlight.js/tree/master/src/styles
  theme:
    light: tomorrow
    dark: tomorrow-night

百度统计

Next主题已经默认支持百度统计，直接在themes/next/_config.yml 中找到 baidu_analytics 填上app_id就可以了。

1 2	# Baidu Analytics baidu_analytics: # <app_id>

这个app_id可以从百度统计给的安装代码中获取：注册登录https://tongji.baidu.com/，找到网站统计 -> 账户管理 -> 代码获取，在

评论系统

NexT现在支持六种评论系统 changyan、disqus、disqusjs、gitalk、livere、valine。在当年多说关闭之后，其他国产的评论系统要么风雨飘摇，要么风评不加，这里还是坚持使用Disqus吧。在themes/next/_config.yml 中设置disqus enable。

# Multiple Comment System Support
comments:
  # Available values: tabs | buttons
  style: tabs
  # Choose a comment system to be displayed by default.
  # Available values: changyan | disqus | disqusjs | gitalk | livere | valine
  active: disqus
  # Setting `true` means remembering the comment system selected by the visitor.
  storage: true
  # Lazyload all comment systems.
  lazyload: false
  # Modify texts or order for any navs, here are some examples.
  nav:
    #disqus:
    #  text: Load Disqus
    #  order: -1
    #gitalk:
    #  order: -2
    
# Disqus
disqus:
  enable: true
  shortname: <your disqus shotname>
  count: false
  #post_meta_order: 0

侧边栏

自定义目录

在themes/next/_config.yml中打开categories，tags和archives目录

# ---------------------------------------------------------------
# Menu Settings
# ---------------------------------------------------------------

# Usage: `Key: /link/ || icon`
# Key is the name of menu item. If the translation for this item is available, the translated text will be loaded, otherwise the Key name will be used. Key is case-senstive.
# Value before `||` delimiter is the target link, value after `||` delimiter is the name of Font Awesome icon.
# When running the site in a subdirectory (e.g. yoursite.com/blog), remove the leading slash from link value (/archives -> archives).
# External url should start with http:// or https://
menu:
  home: / || fa fa-home
  #about: /about/ || fa fa-user
  tags: /tags/ || fa fa-tags
  categories: /categories/ || fa fa-th
  archives: /archives/ || fa fa-archive
  #schedule: /schedule/ || fa fa-calendar
  #sitemap: /sitemap.xml || fa fa-sitemap
  #commonweal: /404/ || fa fa-heartbeat

NexT主题只会自动生成home和archives目录，需要categories和tags目录的话需要手动添加：

使用hexo新建page

1	$ hexo new page tags

修改source/tags/index.md文件，添加一行 type: tags

title: Tags
date: 2014-12-22 12:39:04
type: tags
---

修改TOC配置

TOC 可以在点开文章后在侧边栏显示大纲，这里根据个人喜好，修改两项：

展开所有子目录
Wrap 长标题到下一行

# Table of Contents in the Sidebar
# Front-matter variable (unsupport wrap expand_all).
toc:
  enable: true
  # Automatically add list number to toc.
  number: true
  # If true, all words will placed on next lines if header width longer then sidebar width.
  wrap: true
  # If true, all level of TOC in a post will be displayed, rather than the activated part of it.
  expand_all: true
  # Maximum heading depth of generated toc.
  max_depth: 6

打开back2top

back2top:
  enable: true
  # Back to top in sidebar.
  sidebar: true
  # Scroll percent label in b2t button.
  scrollpercent: true

会在侧边栏显示可以返回顶部的箭头和当前滚动的百分比。

Cloud's Blog

使用Hexo的NexT主题

介绍

安装

配置