优化NexT 6.0版本

优化NexT 6.0,本文完全按照个人喜欢设置

本文主要参考:链接,特别感谢

Schemes主题选择

以下配置均在NexT主题配置文件:themes/next/_config.yml

1
2
3
4
5
# Schemes
# scheme: Muse
# scheme: Mist
# scheme: Pisces
scheme: Gemini

取消文章不自动折叠

首页文章不显示全部,折叠起来,防止文章过长影响阅读

1
2
3
auto_excerpt:
enable: true #此处改为true,意为自动折叠,length为折叠的长度
length: 150

或者采取另一种方案,在文章中间插入一句,即可实现随意折叠,且优先级高于上面的方案,可以两者共同使用

1
<!--more-->

当然你也可以在文章头加上,这样在文章列表只会显示你的描述

1
description: 文章描述

取消目录自动显示

文章默认会展开右侧目录如果存在的话,我不太喜欢,隐藏掉

1
2
3
4
5
6
sidebar:
# - post 默认值,如果有目录自动展开,可隐藏
# - always 总是存在,不可隐藏
# - hide 默认隐藏,可以展开(采用这种)
# - remove 移除
display: hide

去掉文章目录标题的自动编号

1
2
3
4
5
6
toc:
enable: true
number: false # 将此改为false即可
wrap: true # 将此改为true每行目录超长自动换行
expand_all: false
max_depth: 6

设置网站缩略图标

1
2
3
4
5
6
7
favicon:
small: /images/jackkke.jpg
medium: /images/jackkke.jpg
apple_touch_icon: /images/jackkke.jpg
# safari_pinned_tab: /images/logo.svg
#android_manifest: /images/manifest.json
#ms_browserconfig: /images/browserconfig.xml

设置头像

1
2
3
4
5
avatar:
url: /images/jackkke.jpg # 需要把jackkke.jpg放到themes/next/source/images下
rounded: false
opacity: 1
rotated: false

Github follow me 图标

1
2
3
4
github_banner:
enable: true # 将此改为true,即可显示在右上角
permalink: https://github.com/jackkke
title: Follow me on GitHub

打赏功能

1
2
3
4
5
6
7
8
reward_settings:
enable: true # 将此改成true,即可出现打赏按钮
animation: false
comment: 坚持原创技术分享,您的支持将鼓励我继续创作!
reward:
wechatpay: /images/wechatpay.jpg # 此处去掉注释,并将你自己的收款码放到图片文件夹即可看到效果
# alipay: /images/alipay.png
#bitcoin: /images/bitcoin.png

丰富首页

选择你需要的功能

放开注释,该功能即可使用,键值对的值双竖线前面的代表功能名称,也就是访问路径,后面代表图标名称,默认即可

1
2
3
4
5
6
7
8
9
menu:
home: / || home //首页
archives: /archives/ || archive //归档
categories: /categories/ || th //分类
tags: /tags/ || tags //标签
about: /about/ || user //关于
# schedule: /schedule/ || calendar //日程表
# sitemap: /sitemap.xml || sitemap //站点地图
commonweal: /404/ || heartbeat //公益404

分类功能

使用方法为在文章首title代码块处加上[categories: 分类名]即可

1
2
3
4
# 控制台执行该命令(下同)
hexo new page categories
生成的页面中加上
type: "categories"

标签功能、

使用方法为在文章首title代码块处加上[tags: 标签名]即可

1
hexo new page tags
1
2
3
4
5
6
# 多tags也可以,方法为:
tags:
- 标签1
- 标签2
# 或
tags: [标签1, 标签2]

关于页面

1
hexo new page about

本地搜索

1
2
3
# 先执行,下面这行代码,增加依赖
npm install hexo-generator-search --save
npm install hexo-generator-searchdb --save
1
2
3
4
5
6
7
8
9
10
11
12
#修改HEXO配置文件,增加以下内容
search:
path: search.xml
field: post
format: html
limit: 10000

#然后修改NEXT配置文件
local_search:
enable: true # 此处改为true,增加本地搜索功能
trigger: auto
top_n_per_article: 1

404页面

1
hexo new page 404

在自动生成的页面后追加以下内容

1
2
3
4
5
6
7
8
9
10
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>早点回家</title>
</head>
<body>
<script type="text/javascript" src="//qzonestyle.gtimg.cn/qzone/hybrid/app/404/search_children.js" homePageName="返回首页" homePageUrl="https://jackkke.github.io"></script>
</body>
</html>

草稿

1
2
3
4
# 执行下面命令,生成名为“草稿.md”的草稿在/source/_drafts文件夹下
hexo new draft "草稿"
# 执行下面命令,直接把草稿“草稿.md”发布,也可以手动把_drafts文件夹下的*.md文件移到_posts下
hexo publish "草稿"
1
2
# 如果想在测试环境查看草稿,可以修改hexo配置文件
render_drafts: true
1
2
# 或者使用以下启动命令来启动项目
hexo server --drafts

增加评论功能

LiveRe我首先采用的是LiveRe,参考链接:点我达,但这个评论系统初始化超级慢,被弃用

1
2
3
# LiveRe comments system
# You can get your uid from https://livere.com/insight/myCode (General web site)
livere_uid: 注册成功登陆后找到data-uid,将其填到这个地方即可

gitment

然后又发现了gitment,但他的问题比较多,比如issue名长度限制、第一次初始化也有很大问题,弄到一半弃用

gitalk

最终采取的方案是gitalk,issue名限制问题也不存在。gitalk和gitment采取的解决方案相同,都是issue,这两个方案目前NexT都已经直接支持,需要先去注册一下OAuth点我达,记下Client ID和Client Secret。

注意Authorization callback URL填自己的网站url: https://jackkke.github.io/

1
2
3
4
5
6
7
8
9
gitalk:
enable: true # 这个地方改为true
github_id: 你的github名
repo: 专门存储评论系统的资源库,或者本项目资源库亦可
client_id: 你的oauth ID
client_secret: 你的oauth 密码
admin_user: 管理员的github name,可以是多个['name1', 'name2'],必须要设置,需要管理员来初始化评论
distraction_free_mode: true
language:

添加站点与文章访问计数

1
2
3
4
5
6
7
8
busuanzi_count:
enable: true # 将此改为true,开放计数功能
total_visitors: true
total_visitors_icon: user
total_views: true
total_views_icon: eye
post_views: true
post_views_icon: eye

底部计数只有图标,没有文字,打开themes/next/layout/_third-party/analytics/busuanzi-counter.swig

1
2
3
4
5
<i class="fa fa-{{ theme.busuanzi_count.total_visitors_icon }}"></i>

# 增加 {{ __('footer.total_visitors') }}更改为

<i class="fa fa-{{ theme.busuanzi_count.total_visitors_icon }}"> {{ __('footer.total_visitors') }}</i>
1
2
3
4
5
6
<i class="fa fa-{{ theme.busuanzi_count.total_views_icon }}"></i>

# 增加 {{ __('footer.total_views') }}更改为

<i class="fa fa-{{ theme.busuanzi_count.total_views_icon }}"> {{ __('footer.total_views') }}</i>

隐藏版本信息

1
2
powered:
enable: false # 此处改为false,隐藏hexo信息 version: false # 只将此处改为false,只隐藏版本信息theme: enable: false # 此处改为false,隐藏next scheme信息 version: false # 只将此处改为false,只隐藏版本信息

post_edit

系列文章