[三万字教程]基于Hexo的matery主题搭建博客并深度优化一站式完全教程

All in one 一站式Hexo配置优化教程！
本文很长，特别长，快卡死编辑器了，如是被拆分为6篇文章了，见文末链接。
如果你遇到了什么问题，可以尝试搜索本文，你很可能有收获！ CtRL + F，还可以试试右上角菜单搜索功能。
欢迎光临博主的独立博客夜法之书，本文授权CC4.0非商用，转载请注明出处
本文就教你搭建一个美观实用的博客系统，步骤极尽详细！
本文中提到的大量特性，已经被博主提交到matery主题develop分支，提交记录见Commit。所以下面很多特性已经不用自己修改了，可以直接使用。
参考列表放到了最后一篇末尾，去找找看，里面能发现很多好东西。
Tips：友情提示，部分内容RSS输出获取不到，请跳转到源网页地址浏览全文！

选择Hexo的理由？

Hexo创建者是台湾人，对中文支持很友好！
Hexo开源，方便学习和修改
Hexo生态非常完善，各种插件极其丰富！而且基本全部免费、开源！
Hexo对Markdown支持非常完善，对比遍各种博客框架，hexo对Markdown支持最友好
Hexo静态部署，不需要php,java之类的运行环境，方便各种部署环境。不需要购买vps,就有各种免费的部署环境！最低0成本建立独立博客！
所有文章和源码可以使用Git管理，方便保存和维护
缺点：最好懂一点npm web编程技术，不懂也没关系，各种教程非常丰富！

写博客的重要性

立德、立功、立言“三不朽”

《左传》载曰：“太上有立德，其次有立功，其次有立言，虽久不废，此之谓不朽。”

最终效果如下图所示！
支持离线访问。
支持浅色/深色模式。背景随机图片自动切换，并区分黑暗模式图片！
支持文章RSS订阅，并支持文章分类订阅。
看板娘文字功能提示。
footer 栏新增支持繁简转换
支持新博文订阅通知，右下角小铃铛点击订阅！ chrome用户可能由于网络原因链接不到Google的服务器而看不到这个小铃铛。edge 和 Firefox 用户可以正常订阅。

支持离线模式

service worker 实现的渐进式App，不仅可以离线浏览，还可以加速缓存访问！

博客深色模式

深色模式，夜晚保护您的视力！

RSS订阅与文章分类订阅

RSS Hub 和 TTRSS 私有部署实现订阅。
配合浏览器扩展 RSSHub Radar (opens new window)和移动端辅助 App RSSBud (opens new window)(iOS) 与 RSSAid (opens new window)(Android) 食用。
教程：RSS的使用与Tiny Tiny RSS Selfhost自建

看板娘触发文字提示

对所有菜单和常用按钮做了文字功能提示。
支持看板娘模型切换，服装切换，某些模型还有语音互动！
看板娘还可以自定义时间提示，特殊节日提示等等。参考 Hexo博客个性定制篇中来完成吧。

博客性能优化

经过多次优化，新版看板娘资源异步加载体积大拖累的性能分数。其它几乎都是满分了！
大量使用本地缓存，牺牲了第一次加载的体积，保证了第二次打开几乎都是使用缓存，异步加载对第一次渲染速度影响不大，但可以极大的提高第二次来自后续的访问速度！

Hexo系列

HexoRSS分类订阅

[三万字教程]基于Hexo的matery主题搭建博客并深度优化完全一站式教程

markdown 各种其它语法插件，latex公式支持，mermaid图表，plant uml图表，URL卡片，bilibili卡片，github卡片，豆瓣卡片，插入音乐和视频，插入脑图，插入PDF，嵌入iframe

Hexo Docker环境使用篇

Docker 简介：

Docker 是一种轻量级的虚拟机环境，可以隔离主机的运行环境，内核公用主机的，运行库和环境是 Docker 私有的。运行 Docker 程序只比主机直接运行程序性能损失微乎其微。使用 Docker 你可以同时运行各种各样运行库环境而不用担心搞乱你的主机运行库环境！
Docker 运行负载远小于 Vmware 这类虚拟机， Vmware 需要模拟对应的CPU指令，再虚机运行一个虚拟机自己的内核，再这个虚拟机内核之上，再运行虚拟机的运行库和程序。比 Docker 多了一个内核模拟和运行，Cpu 和内存开销大增！

Docker 版 hexo 环境一键部署

博主开源定制，推荐使用！省去您大量环境配置时间。
使用Hexo Docker之前需要Docker 环境，请参阅后文Docker安装方法
docker-hub
Github-hexo

使用推荐Docker来搭配本文，阅读使用，将更省事，方便，快捷。hexo环境一键搞定！

Docker一键安装

docker create --name=hexo \
-e HEXO_SERVER_PORT=4000 \
-e GIT_USER="17lai" \
-e GIT_EMAIL="[email protected]" \
-v /mnt/blog.17lai.site:/app \
-p 4000:4000 \
bloodstar/hexo

Docker镜像直接提供最新版本node ，hexo

hexo web 后台写作

基于 hexo-admin 实现，具体配置实现方法见后文。
最终效果如下图所示。blog.17lai.fun 访问blog，添加后缀 admin 访问 hexo 后台。
使用前面提到的 hexo docker ，启动运行 hexo docker 后，非自动安装 hexo-admin 以及常用插件，你也可以自定义安装你虚幻的插件， vi /app/useRun.sh。

hexo-admin 主界面

hexo-admin 编辑写作界面

配置 hexo-admin 根目录下_config.yml:

admin:
  username: myfavoritename #用户名
  password_hash: be121740bf988b2225a313fa1f107ca1 #密码
  secret: a secret something # secret is used to make the cookies secure
  deployCommand: '/app/tools/cide.sh'  # 自定义的部署脚本，在 hexo admin 的 deploy 标签页 deploy 按钮点击调用

配置 post metadata 根目录下_config.yml:

# add and edit your own post metadata with the admin interface
metadata:
  author_id: defaultAuthorId
  language:

hexon

Github: hexon
另一个hexo web 编辑界面，界面比hexo-admin更现代化。安装配置方法见Github

hexon

hexo-editor

hexo-editor
又一个hexo web 编辑器

hexo editor 登录

hexo editor 预览

hexo editor 编辑

支持手机

Qexo

https://github.com/Qexo/Qexo
A Quick, Powerful and Pretty Online Manager for Hexo.
类似项目
https://github.com/Wexagonal/Wexagonal
轻量级\多平台\开箱即用的hexo后端管理器

ssh key 部署

Docker会自动随机生成ssh key 在 /app/.ssh 目录下面。自动部署请把ssh key添加到github 等平台。

Github详细教程

将SSH 公钥复制到剪贴板。 …
在任何页面的右上角，单击您的个人资料照片，然后单击Settings（设置）。
在用户设置侧边栏中，单击SSH and GPG keys（SSH 和GPG 密钥）。
单击New SSH key（新SSH 密钥）或Add SSH key（添加SSH 密钥）。

SSH 进入docker

docker exec -it hexo /bin/bash

然后就可以正常运行hexo的各种命令了，是不是非常简单？快来试试吧。

远程 SSH 访问Docker

推荐使用SecurtCRT 来远程访问你的Docker。

SecurtCRT

自定义用户自动运行脚本

用户可以在这里添加自动配置，自动安装插件，等各种启动docker运行的命令。
它将在Docker启动完成后自动调用运行！

vi /app/useRun.sh

反向代理 Hexo Docker

Nginx (engine x) 是一个高性能的HTTP和反向代理web服务器，同时也提供了IMAP/POP3/SMTP服务。
一些测试可能需要ssl支持，那么用nginx来反向代理一下，就可以在本地愉快的测试ssl加密功能了。
访问docker，需要 192.168.0.100:4000这样数字ip + 端口号的方式不觉得很丑陋，而且需要开大量的端口，使用nginx反向代理，可以直接使用域名访问。
如果你想使用blog.17lai.fun这样的域名访问你的 docker 里面运行的博客，请参考下文。

Nginx也使用docker来运行，blog.17lai.fun为本地域名，修改本地hosts dns信息来访问。

docker compose 配置

nginxweb:
  image: bloodstar/nginx-purge
  container_name: "nginxweb"
  hostname: nginxweb
  ports:
    - "80:80"
    - "443:443"
  restart: always
  volumes:
    # ${USERDIR}为你docker运行目录
    - ${USERDIR}/nginx/conf.d:/etc/nginx/conf.d:ro
    - ${USERDIR}/nginxproxy/certs:/etc/nginx/certs:ro
    - ${USERDIR}/nginx/nginx.conf:/etc/nginx/nginx.conf:ro

bloodstar/nginx-purge

nginx配置

文件 blog.conf ，配置文件放到${USERDIR}/nginx/conf.d目录中

upstream blog {
    server hexo:4000;
}

server {
    listen 80;
    listen 443 ssl http2;
    server_name  blog.17lai.fun;

    ssl_certificate /etc/nginx/certs/17lai.pem;
    ssl_certificate_key /etc/nginx/certs/17lai.key;

    ssl_session_cache shared:aria2SSL:10m;
    ssl_session_timeout  30m;
    #ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
    ssl_ciphers EECDH+CHACHA20:EECDH+AES128:RSA+AES128:EECDH+AES256:RSA+AES256:EECDH+3DES:RSA+3DES:!MD5;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_prefer_server_ciphers on;
    
    access_log /var/log/nginx/blog.17lai.fun_access.log combined;
    error_log  /var/log/nginx/blog.17lai.fun_error.log;
    
    keepalive_requests 10000;
    
    location / {
        #proxy_redirect off;
        proxy_pass http://blog;

        proxy_buffering off;
        
        add_header X-Cache-Status $upstream_cache_status;
        proxy_set_header Host $http_host;

        proxy_set_header X-Forwarded-Proto $scheme;

        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header  X-Forwarded-Ssl     on;
        proxy_set_header  X-Forwarded-For     $proxy_add_x_forwarded_for;      
        proxy_set_header  X-Frame-Options     SAMEORIGIN;
        
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    } 
}

Windows DNS修改

windows hosts文件路径为： C:\Windows\System32\drivers\etc\HOSTS

管理员权限用文本编辑器打开这个文件并添加 192.168.0.100 blog.17lai.fun，然后，你就可以在本地浏览器中使用域名访问你的blog了！

Linux DNS 修改

Linux hosts 文件路径为： /etc/hosts

用文本编辑器或者命令行工具vim打开这个文件并添加 192.168.0.100 blog.17lai.fun，然后，你就可以在本地浏览器中使用域名访问你的blog了！

# root用户一条指令搞定
echo "192.168.0.100 blog.17lai.fun" >> /etc/hosts

#或者使用 vi 或者 vim
vi /etc/hosts

获取 SSL 证书

如果你购买了域名，可以在域名服务商获得免费的ssl证书。
自己生成私有证书，使用时需要给本地计算机，浏览器添加你自己的根证书，才能使你的ssl 证书在你自己的浏览器中生效。

使用Hexo Docker之前需要Docker 环境，下面是Docker 环境安装方法。

Centos 安装Docker

X86（一键安装脚本）：

curl -sSL https://get.docker.com/ | sh

Arm：

步骤1

sudo yum install -y yum-utils device-mapper-persistent-data lvm2

步骤2

添加仓库

sudo yum-config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo

步骤3

安装Docker

sudo yum install docker-ce docker-ce-cli containerd.io

centos docker

centos docker 完成安装

步骤4

启动Docker

sudo systemctl start docker

QNAP 安装Docker

在系统应用的AppCenter中找到 Container Station，可以直接点击安装即可。

qnap docker

群晖安装 Docker

首先要说的是，x86 平台的群晖才能用的上 Docker 套件，因此，ARM 架构平台的群晖只能说非常遗憾了。
　　打开套件中心，在 “所有套件” 中找到 Docker 并安装：

群晖 Docker

Hexo入门篇

Hexo 通用简明教程

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。

前提

安装 Hexo 相当简单，只需要先安装下列应用程序即可：

Node.js (Node.js 版本需不低于 8.10，建议使用 Node.js 10.0 及以上版本)
Git
nmp

安装

所有必备的应用程序安装完成后，即可使用 npm 安装 Hexo。

npm install -g hexo-cli

安装以后，可以使用以下两种方式执行 Hexo：

npx hexo
将 Hexo 所在的目录下的 node_modules 添加到环境变量之中即可直接使用： hexo

echo 'PATH="$PATH:./node_modules/.bin"' >> ~/.profile

升级

后期需要升级的化，进入 blog 目录，先检查更新:

$ npm outdated
Package                  Current  Wanted  Latest  Location
hexo                       3.9.0   3.9.0   4.2.0  hexo-site
hexo-deployer-git          1.0.0   1.0.0   2.1.0  hexo-site
hexo-generator-archive     0.1.5   0.1.5   1.0.0  hexo-site
hexo-generator-category    0.1.3   0.1.3   1.0.0  hexo-site
hexo-generator-feed        1.2.2   1.2.2   2.2.0  hexo-site
hexo-generator-index       0.2.1   0.2.1   1.0.0  hexo-site
hexo-generator-tag         0.2.0   0.2.0   1.0.0  hexo-site
hexo-renderer-ejs          0.3.1   0.3.1   1.0.0  hexo-site
hexo-renderer-marked       0.3.2   0.3.2   2.0.0  hexo-site
hexo-renderer-stylus       0.3.3   0.3.3   1.1.0  hexo-site
hexo-server                0.3.3   0.3.3   1.0.0  hexo-site

修改 package.json 文件，基于 Latest 列内容更新版本号，然后更新并检查版本号：

$ npm install --save

# 检查版本号
$ hexo -v
hexo: 4.2.0
hexo-cli: 3.1.0
......

建站

安装 Hexo 完成后，请执行下列命令，Hexo 将会在指定文件夹中新建所需要的文件。

hexo init <folder>
cd <folder>
npm install

启动网页服务

此时，通过 hexo s 命令即可在本地启动您的博客站点了。

$ hexo s
INFO  Start processing
INFO  Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.

接下来将安装主题，配置博客托管平台，实现一键发布并刷新 CDN 缓存。

npm下载加速

安装淘宝镜像，加速NPM

npm config set registry http://registry.npmmirror.com

安装CNPM

个人使用体验来说，npm兼容性最好，如果你遇到某个包cnpm或者yarn安装失败，试试最原始的老婆吗，或许有奇效！

npm install -g cnpm --registry=http://registry.npmmirror.com

Hexo 日常操作命令

# 进入hexo docker 环境。需要你已经安装了docker环境，并安装了上文提到的hexo docker
docker exec -it hexo /bin/bash
# 运行完这条命令后，你就发现命令提示符变了，你此时进入了一个独立于你的主机运行环境的新的 node + hexo 开发环境了。

# 生成新页面 404
hexo new page 404

# 新增新文章 2022-03-26-blog.17lai.site
hexo new post 2022-03-26-blog.17lai.site

# 清理上次生成的静态网页，可以不运行，但你修改了一些源码后，很可能有各种不生效或错误
hexo clean

# 生成静态网页
hexo g

# gulp调用gulpfile.js压缩静态网页相关代码，减小网页体积
gulp 

# 调用根目录中 _config.yml 文件的deploy配置的参数来部署你的静态网页
hexo d

hexo 目录结构说明

在执行过Hexo deploy命令之后，目录结构新增了.deploy_git，public，.gitignore，如下：

 $ tree -L 2
.
├── .deploy_git
├── node_modules
├── public
├── scaffolds
│   ├── draft.md
│   ├── page.md
│   └── post.md
├── source
│   ├── _posts
│   ├── _drafts
├── themes
├── _config.yml
├── db.json
├── package.json
└── package-lock.json

_config.yml

用来配置博客相关的参数，初始化时自动创建。具体参数设置，可参照 Hexo 配置文档。

node_modules 和 package.json

都是在初始化时自动创建。

node_modules用来存储已安装的各类依赖包。
package.json用来查看 Hexo 的版本以及相关依赖包的版本。

Hexo 会默认安装：

hexo：主程序
hexo-deployer-git：实现 git 部署方式
hexo-generator-archive：存档页面生成器
hexo-generator-category：分类页面生成器
hexo-generator-index：index 生成器
hexo-generator-tag：标签页面生成器
hexo-renderer-ejs：支持 EJS 渲染
hexo-renderer-marked：Markdown 引擎
hexo-renderer-stylus：支持 stylus 渲染
hexo-server：支持本地预览，默认地址 localhost:4000

新安装的依赖包，也会保存在node_module文件夹下。

scaffold

模板文件夹，初始化时自动创建。包含page，post，draft三种模板，分别对应页面、要发布的文章、草稿。

themes

主题文件夹，初始化时自动创建。每一个主题，都有一个单独的文件夹。默认主题为 landscape。

source ， public 和 .deploy_git

source：资源文件夹。用来存放图片、Markdown 文档（文章、草稿）、各种页面（分类、关于页面等）。
public：将 source 文件夹里的 Markdown 文档，转换成 index.html。再结合主题进行渲染，就是我们最终看到的博客。
.deploy_git：将 public 文件夹的内容提交到 Github 后生成，内容与 public 文件夹基本一致。

这三者的关系大致是：source -> public -> .deploy_git

执行hexo generate，根据 source，更新 public。
执行hexo deploy，根据 public，更新 .deploy_git。

常用命令

指令说明

hexo server #启动本地服务器，用于预览主题。Hexo 会监视文件变动并自动更新，除修改站点配置文件外,无须重启服务器,直接刷新网页即可生效。
hexo server -s #以静态模式启动
hexo server -p 5000 #更改访问端口 (默认端口为 4000，’ctrl + c’关闭 server)
hexo server -i IP地址 #自定义 IP
hexo clean #清除缓存 ,网页正常情况下可以忽略此条命令,执行该指令后,会删掉站点根目录下的 public 文件夹
hexo g #生成静态网页 (执行 $ hexo g后会在站点根目录下生成 public 文件夹, hexo 会将”/blog/source/“ 下面的.md 后缀的文件编译为.html 后缀的文件,存放在”/blog/public/ “ 路径下)
hexo d #自动生成网站静态文件，并将本地数据部署到设定的仓库(如 github)
hexo init 文件夹名称 #初始化 XX 文件夹名称
npm update hexo -g#升级
npm install hexo -g #安装
node -v #查看 node.js 版本号
npm -v #查看 npm 版本号
git --version #查看 git 版本号
hexo -v #查看 hexo 版本号
hexo new page “music” #新增页面music
hexo new post “文章名称” #新增文章

简写指令

hexo n "我的第一篇文章" 等价于 hexo new "我的第一篇文章" 还等价于 hexo new post "我的第一篇文章"
hexo p 等价于 hexo publish
hexo g 等价于 hexo generate
hexo s等价于 hexo server
hexo d 等价于 hexo deploy
hexo g -d等价于hexo generate --deploy

注: hexo clean 没有简写, git --version 没有简写

hexo版本升级

Docker镜像直接提供最新版本node，hexo

升级 Node

# n 是交互式 node.js 版本管理工具
sudo npm install -g n
# 更新到 node 16 LTS
sudo n 16

升级 Hexo

# 安装 npm-check 和 npm-upgrade
npm install -g npm-check npm-upgrade
# 检查本地插件版本
npm-check
# 交互式升级，根据提示即可完成升级
npm-upgrade

现在 Hexo 及插件已经升级成功，执行 hexo version 查看版本。

设置npm源的几种方式

原始源

# the original source
https://registry.npmjs.org/

方案: 使用nrm

安装

npm install -g nrm

列出源的候选项

nrm ls

输出结果：

* npm -------- https://registry.npmjs.org/
  yarn ------- https://registry.yarnpkg.com/
  cnpm ------- http://r.cnpmjs.org/
  taobao ----- https://registry.npmmirror.com/
  nj --------- https://registry.nodejitsu.com/
  npmMirror -- https://skimdb.npmjs.com/registry/
  edunpm ----- http://registry.enpmjs.org/

使用淘宝源

nrm use taobao

方案: 改变全局的注册

设置成淘宝源

npm config set registry https://registry.npmmirror.com

查看结果

npm config get registry

输出结果：

https://registry.npmmirror.com/

测试一下

npm info underscore

方案: 在命令行里指定源

npm --registry https://registry.npmmirror.com install [name]

方案: 修改 `~/.npmrc`

registry = https://registry.npmmirror.com

方案: 使用cnpm

npm install -g cnpm --registry=https://registry.npmmirror.com
cnpm install [name]

Hexo基础配置篇

下载主题

hexo-theme-matery 是一个采用 Material Design 和响应式设计的 Hexo 博客主题，点击这里可以查看示例效果。点击这里下载 master 分支的最新稳定版的代码，解压缩后，将 hexo-theme-matery 的文件夹复制到 Hexo 的 themes 文件夹中即可。

Docker环境命令

git clone https://github.com/blinkfox/hexo-theme-matery.git /app/themes/matery;

切换主题

修改 Hexo 根目录下的 _config.yml 的 theme 的值：theme: hexo-theme-matery

`_config.yml` 文件的其它修改建议

请修改 _config.yml 的 url 的值为你的网站主 URL（如：http://xxx.github.io）。
建议修改两个 per_page 的分页条数值为 6 的倍数，如：12、18 等，这样文章列表在各个屏幕下都能较好的显示。
如果是中文用户，则建议修改 language 的值为 zh-CN。

在本主题的 _config.yml 中可以修改部分自定义信息，有以下几个部分：

菜单
我的梦想
首页的音乐播放器和视频播放器配置
是否显示推荐文章名称和按钮配置
favicon 和 Logo
个人信息
TOC 目录
文章打赏信息
复制文章内容时追加版权信息
MathJax
文章字数统计、阅读时长
点击页面的’爱心’效果
我的项目
我的技能
我的相册
Gitalk、Gitment、Valine 和 disqus 评论配置
不蒜子统计和谷歌分析（Google Analytics）
默认特色图的集合。当文章没有设置特色图时，本主题会根据文章标题的 hashcode 值取余，来选择展示对应的特色图

新建主题必备about、tags、404等页面

新建分类 categories 页

categories 页是用来展示所有分类的页面，如果 source 目录下还没有 categories/index.md 文件，那么就需要新建一个，命令如下：

hexo new page "categories"

编辑你刚刚新建的页面文件 /source/categories/index.md，至少需要以下内容：

---
title: categories
date: 2018-09-30 17:25:30
type: "categories"
layout: "categories"
---

新建标签 tags 页

tags 页是用来展示所有标签的页面，如果 source 目录下还没有 tags/index.md 文件，那么就需要新建一个，命令如下：

hexo new page "tags"

编辑刚刚新建的页面文件 /source/tags/index.md，至少需要以下内容：

---
title: tags
date: 2018-09-30 18:23:38
type: "tags"
layout: "tags"
---

新建留言板 contact 页

contact 页是用来展示留言板信息的页面，如果在你的博客 source 目录下还没有 contact/index.md 文件，那么你就需要新建一个，命令如下：

hexo new page "contact"

编辑你刚刚新建的页面文件 /source/contact/index.md，至少需要以下内容：

---
title: contact
date: 2018-09-30 17:25:30
type: "contact"
layout: "contact"
---

注：本留言板功能依赖于第三方评论系统，请激活你的评论系统才有效果。并且在主题的 _config.yml 文件中，第 19 至 21 行的“菜单”配置，取消关于留言板的注释即可。

新建友情链接 friends 页

friends 页是用来展示友情链接信息的页面，如果在你的博客 source 目录下还没有 friends/index.md 文件，那么你就需要新建一个，命令如下：

hexo new page "friends"

编辑你刚刚新建的页面文件 /source/friends/index.md，至少需要以下内容：

---
title: friends
date: 2018-12-12 21:25:30
type: "friends"
layout: "friends"
---

同时，在你的博客 source 目录下新建 _data 目录，在 _data 目录中新建 friends.json 文件，文件内容如下所示：

[{
    "avatar": "https://blog.17lai.site/favicon.png",
    "name": "夜法之书的Blog",
    "introduction": "嵌入式，Linux Kernel&Driver, PT, Docker, Nas等等",
    "url": "https://blog.17lai.site",
    "title": "前去学习"
},{
    "avatar": "http://image.luokangyuan.com/1_qq_27922023.jpg",
    "name": "码酱",
    "introduction": "我不是大佬，只是在追寻大佬的脚步",
    "url": "http://luokangyuan.com/",
    "title": "前去学习"
}, {
    "avatar": "http://image.luokangyuan.com/4027734.jpeg",
    "name": "闪烁之狐",
    "introduction": "编程界大佬，技术牛，人还特别好，不懂的都可以请教大佬",
    "url": "https://blinkfox.github.io/",
    "title": "前去学习"
}, {
    "avatar": "http://image.luokangyuan.com/avatar.jpg",
    "name": "ja_rome",
    "introduction": "平凡的脚步也可以走出伟大的行程",
    "url": "https://me.csdn.net/jlh912008548",
    "title": "前去学习"
}]

新建关于我 about 页

about 页是用来展示关于我和我的博客信息的页面，如果 source 目录下还没有 about/index.md 文件，那么就需要新建一个，命令如下：

hexo new page "about"

编辑刚刚新建的页面文件 /source/about/index.md，至少需要以下内容：

---
title: about
date: 2018-09-30 17:25:30
type: "about"
layout: "about"
---

新建404页

新建一个404.md文件

在hexo的souce文件夹下创建一个404.md，之后输入如下内容：

---
title: 404
date: 2019-11-23 21:10:10
type: "404"
layout: "404"
---

新建404.md

然后hexo g生成页面中就有404。只是页面较丑。

404页面美化

下载404特效
点击下载代码:点我去代码出处

移植

放入js文件到主题中

将下载的压缩包解压，会发现里面有两个js文件和一个html页面，重要的就是js文件，将文件移植到主题的source文件的libs文件夹下，需要自己创建一个文件夹，我给文件夹取的名字叫做404。

导入404 js

因为该主题的js文件都是写_config.yml文件里面的，为了规范，也需要将文件的路径写到该文件夹下

如下，之后导入js文件的时候就可以使用404bodymovin和404data来代替了

修改主题_config.yml文件

编辑404.esj

<style type="text/css">
    /* don't remove. */
    .page404-cover {
        /* height: 75vh; */
        height: 88vh;
    }
 
    #svgContainer {
      width: 100%;
      height: 100%;
      background-color: white;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      margin: auto;
    }
</style>

<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.404bodymovin) %>"></script>
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.404data) %>"></script>

<div class="bg-cover pd-header page404-cover">
    <div id="svgContainer"></div>
 
    <script type="text/javascript">
        var svgContainer = document.getElementById('svgContainer');
        var animItem = bodymovin.loadAnimation({
          wrapper: svgContainer,
          animType: 'svg',
          loop: true,
          animationData: JSON.parse(animationData)
        });
    </script>
</div>

现在就移植成功了，使用下面命令上传，之后输入一个错误的页面就可以查看到了

hexo cl && hexo g -d

Tips: 不要再本地试验，本地的时候输入错误的页面不会显示404页面的。

新建友情连接 friends 页（可选的）

friends 页是用来展示友情连接信息的页面，如果 source 目录下还没有 friends/index.md 文件，那么就需要新建一个，命令如下：

hexo new page "friends"

编辑刚刚新建的页面文件 /source/friends/index.md，至少需要以下内容：

---
title: friends
date: 2018-12-12 21:25:30
type: "friends"
layout: "friends"
---

同时，在 source 目录下新建 _data 目录，在 _data 目录中新建 friends.json 文件，文件内容如下所示：

[{
    "avatar": "https://blog.17lai.site/favicon.png",
    "name": "和博主交换链接",
    "introduction": "如何和博主交换友情链接介绍。",
    "url": "https://blog.17lai.site/friends",
    "title": "前去交换"
},{
    "avatar": "https://images.weserv.nl?url=https://einverne.github.io/images/favicon.ico",
    "name": "Ein Verne的Blog",
    "introduction": "毅力帝！坚持写了99页的独立BLog博主！",
    "url": "https://blog.einverne.info/",
    "title": "前去学习"
},{
    "avatar": "https://images.weserv.nl?url=https://blinkfox.github.io/favicon.png",
    "name": "闪烁之狐",
    "introduction": "Matary 主题的作者。",
    "url": "https://blinkfox.github.io/",
    "title": "前去学习"
}]

菜单导航配置

配置基本菜单导航的名称、路径url和图标icon.

1.菜单导航名称可以是中文也可以是英文(如：Index或主页)
2.图标icon 可以在Font Awesome 中查找

menu:
  Index:
    url: /
    icon: fas fa-home
  Tags:
    url: /tags
    icon: fas fa-tags
  Categories:
    url: /categories
    icon: fas fa-bookmark
  Archives:
    url: /archives
    icon: fas fa-archive
  About:
    url: /about
    icon: fas fa-user-circle
  Friends:
    url: /friends
    icon: fas fa-address-book

二级菜单配置方法

如果你需要二级菜单则可以在原基本菜单导航的基础上如下操作

在需要添加二级菜单的一级菜单下添加children关键字(如:About菜单下添加children)
在children下创建二级菜单的名称name,路径url和图标icon.
注意每个二级菜单模块前要加 -.
注意缩进格式

menu:
  Index:
    url: /
    icon: fas fa-home
  Tags:
    url: /tags
    icon: fas fa-tags
  Categories:
    url: /categories
    icon: fas fa-bookmark
  Archives:
    url: /archives
    icon: fas fa-archive
  About:
    url: /about
    icon: fas fa-user-circle-o
  Friends:
    url: /friends
    icon: fas fa-address-book
  Medias:
    icon: fas fa-list
    children:
      - name: Music
        url: /music
        icon: fas fa-music
      - name: Movies
        url: /movies
        icon: fas fa-film
      - name: Books
        url: /books
        icon: fas fa-book
      - name: Galleries
        url: /galleries
        icon: fas fa-image

文章 Front-matter 介绍

Front-matter 选项详解

Front-matter 选项中的所有内容均为非必填的。但仍然建议至少填写 title 和 date 的值。

配置选项	默认值	描述
title	`Markdown` 的文件标题	文章标题，强烈建议填写此选项
date	文件创建时的日期时间	发布时间，强烈建议填写此选项，且最好保证全局唯一
author	根 `_config.yml` 中的 `author`	文章作者
img	`featureImages` 中的某个值	文章特征图，推荐使用图床(腾讯云、七牛云、又拍云等)来做图片的路径.如: `http://xxx.com/xxx.jpg`
top	`true`	推荐文章（文章是否置顶），如果 `top` 值为 `true`，则会作为首页推荐文章
hide	`false`	隐藏文章，如果`hide`值为`true`，则文章不会在首页显示
cover	`false`	`v1.0.2`版本新增，表示该文章是否需要加入到首页轮播封面中
coverImg	无	`v1.0.2`版本新增，表示该文章在首页轮播封面需要显示的图片路径，如果没有，则默认使用文章的特色图片
password	无	文章阅读密码，如果要对文章设置阅读验证密码的话，就可以设置 `password` 的值，该值必须是用 `SHA256` 加密后的密码，防止被他人识破。前提是在主题的 `config.yml` 中激活了 `verifyPassword` 选项
toc	`true`	是否开启 TOC，可以针对某篇文章单独关闭 TOC 的功能。前提是在主题的 `config.yml` 中激活了 `toc` 选项
mathjax	`false`	是否开启数学公式支持，本文章是否开启 `mathjax`，且需要在主题的 `_config.yml` 文件中也需要开启才行
summary	无	文章摘要，自定义的文章摘要内容，如果这个属性有值，文章卡片摘要就显示这段文字，否则程序会自动截取文章的部分内容作为摘要
categories	无	文章分类，本主题的分类表示宏观上大的分类，只建议一篇文章一个分类
tags	无	文章标签，一篇文章可以多个标签
keywords	文章标题	文章关键字，SEO 时需要
reprintPolicy	cc_by	文章转载规则，可以是 cc_by, cc_by_nd, cc_by_sa, cc_by_nc, cc_by_nc_nd, cc_by_nc_sa, cc0, noreprint 或 pay 中的一个

注意:
如果 img 属性不填写的话，文章特色图会根据文章标题的 hashcode 的值取余，然后选取主题中对应的特色图片，从而达到让所有文章都的特色图各有特色。
date 的值尽量保证每篇文章是唯一的，因为本主题中 Gitalk 和 Gitment 识别 id 是通过 date 的值来作为唯一标识的。
如果要对文章设置阅读验证密码的功能，不仅要在 Front-matter 中设置采用了 SHA256 加密的 password 的值，还需要在主题的 _config.yml 中激活了配置。有些在线的 SHA256 加密的地址，可供使用：开源中国在线工具、chahuo、站长工具。

以下为文章的 Front-matter 示例。

最简示例

---
title: 基于Hexo的hexo-theme-matery主题搭建博客并优化
date: 2019-10-03 14:25:00
---

最全示例

---
title: 基于Hexo的hexo-theme-matery主题搭建博客并优化
date: 2019-12-30 09:25:00
author: 17lai.site
img: /medias/cover/hexo.jpg
top: true
cover: true
coverImg: /medias/cover/hexo.jpg
password: 8d969eef6ecad3c29a3a629280e686cf0c3f5d5a86aff3ca12020c923adc6c92
toc: false
mathjax: false
summary: 这是你自定义的文章摘要内容，如果这个属性有值，文章卡片摘要就显示这段文字，否则程序会自动截取文章的部分内容作为摘要
categories: Hexo
keywords: Hexo GitHub blog
tags:
  - Hexo
  - Blog
  - GitHub
---

新建文章模板修改

首先为了新建文章方便，我们可以修改一下文章模板，建议将/scaffolds/post.md修改为如下代码：

---
title: {{ title }}
date: {{ date }}
author: 
img: 
coverImg: 
top: false
cover: false
toc: true
mathjax: false
password:
summary:
tags:
categories:
---

这样新建文章后一些Front-matter参数不用你自己补充了，修改对应信息就可以了。

代码高亮

从 Hexo5.0 版本开始自带了 prismjs 代码语法高亮的支持，本主题对此进行了改造支持。

如果你的博客中曾经安装过 hexo-prism-plugin 的插件，那么你须要执行 npm uninstall hexo-prism-plugin 来卸载掉它，否则生成的代码中会有 { 和 } 的转义字符。

然后，修改 Hexo 根目录下 _config.yml 文件中 highlight.enable 的值为 false，并将 prismjs.enable 的值设置为 true，主要配置如下：

highlight:
  enable: false
  line_number: true
  auto_detect: false
  tab_replace: ''
  wrap: true
  hljs: false
prismjs:
  enable: true
  preprocess: true
  line_number: true
  tab_replace: ''

主题中默认的 prismjs 主题是 Tomorrow Night，如果你想定制自己的主题，可以前往 prismjs 下载页面定制下载自己喜欢的主题 css 文件，然后将此 css 主题文件取名为 prism.css，替换掉 hexo-theme-matery 主题文件夹中的 source/libs/prism/prism.css 文件即可。

添加文章搜索功能

这个插件比广大教程提到的hexo-generator-search插件更加强大和好用！
matery目前只支持search.xml xml格式的搜索文件！

本主题中还使用到了 hexo-generator-searchdb 的 Hexo 插件来做内容搜索，安装命令如下：

npm install hexo-generator-searchdb --save

在 Hexo 根目录下的 _config.yml 文件中，新增以下的配置项：

search:
  path: search.xml
  field: post
  content: true
  format: html

参数含义

path - file path. By default is search.xml. If the file extension is .json, the output format will be JSON. Otherwise XML format file will be exported.
field
- the search scope you want to search, you can chose:
- post (Default) - will only cover all the posts of your blog.
- page - will only cover all the pages of your blog.
- all - will cover all the posts and pages of your blog.
content - whether contains the whole content of each article. If false, the generated results only cover title and other meta info without mainbody. By default is true.
format
- the form of the page contents, options are:
- html (Default) - original html string being minified.
- striptags - original html string being minified, and remove all the tags.
- raw - markdown text of each posts or pages.

修改页脚

页脚信息可能需要做定制化修改，而且它不便于做成配置信息，所以可能需要你自己去再修改和加工。修改的地方在主题文件的 /layout/_partial/footer.ejs 文件中，包括站点、使用的主题、访问量等。

修改社交链接

在主题的 _config.yml 文件中，默认支持 QQ、GitHub 和邮箱的配置，可以在主题文件的 /layout/_partial/social-link.ejs 文件中，新增、修改需要的社交链接地址，增加链接可参考如下代码：

<a
  href="https://github.com/blinkfox"
  class="tooltipped"
  target="_blank"
  data-tooltip="访问我的GitHub"
  data-position="top"
  data-delay="50"
>
  <i class="fa fa-github"></i>
</a>

其中，社交图标（如：fa-github）可以在 Font Awesome 中搜索找到。以下是常用社交图标的标识，供参考：

Facebook: fa-facebook
Twitter: fa-twitter
Google-plus: fa-google-plus
Linkedin: fa-linkedin
Tumblr: fa-tumblr
Medium: fa-medium
Slack: fa-slack
新浪微博: fa-weibo
微信: fa-wechat
QQ: fa-qq

修改打赏的二维码图片

在主题文件的 source/medias/reward 文件中，可以替换成你的的微信和支付宝的打赏二维码图片。

配置文章基本信息

new_post_name: :title.md   # 新文章的文件名称
default_layout: post       # 预设布局
auto_spacing: false        # 在中文和英文之间加入空格
titlecase: false           # 把标题转换为 title case
external_link:             # 在新标签中打开链接
  enable: true             # 在新标签中打开链接
  field:                   # 对整个网站（site）生效或仅对文章（post）生效
  exclude:                 # 需要排除的域名。主域名和子域名如 www 需分别配置	[]
filename_case: 0           # 把文件名称转换为 (1) 小写或 (2) 大写
render_drafts: false       # 显示草稿，默认为：false
post_asset_folder: true    # 启动 Asset 文件夹
relative_link: false       # 把链接改为与根目录的相对位址
future: true               # 显示未来的文章
highlight:                 # 代码块的设置
  enable: false            # 开启代码块高亮
  line_number: false       # 显示行数
  auto_detect: false       # 如果未指定语言，则启用自动检测
  tab_replace:             # 用 n 个空格替换 tabs；如果值为空，则不会替换 tabs

配置代码高亮及样式

从 Hexo5.0 版本开始自带了 prismjs 代码语法高亮的支持，本主题对此进行了改造支持。

然后，修改 Hexo 根目录下 _config.yml 文件中 highlight.enable 的值为 false，并将 prismjs.enable 的值设置为 true，主要配置如下：

highlight:                      # 代码块的设置
  enable: false                 # 开启代码块高亮
  line_number: true             # 显示行数
  auto_detect: false            # 如果未指定语言，则启用自动检测
  tab_replace: ''               # 用 n 个空格替换 tabs；如果值为空，则不会替换 tabs
  wrap: true
  hljs: false
prismjs:
  enable: true
  preprocess: true
  line_number: true
  tab_replace: ''

注意事项

Hexo 内建的 PrismJS 支持浏览器端高亮（preprocess 设置为 false）和服务器端高亮（preprocess 设置为 true）两种方式。

使用服务器端高亮时（preprocess 设置为 true），只需要在站点引入 Prismjs 的主题（CSS 样式表）即可；而使用浏览器端高亮时（preprocess 设置为 false），需要将 JavaScript 文件也引入。

配置代码的样式

code:
  lang: true     # 代码块是否显示名称
  copy: true     # 代码块是否可复制
  shrink: false  # 代码块是否可以收缩
  break: false   # 代码是否折行

配置是否启用转载限制模块

reprint:
  enable: false   #是否启用“转载规则限定模块”
  default: cc_by

文章转载规则，可以是 cc_by, cc_by_nd, cc_by_sa, cc_by_nc, cc_by_nc_nd, cc_by_nc_sa, cc0, noreprint 或 pay 中的一个

配置文章阅读密码功能

阅读文章的密码验证功能，如要使用此功能请激活该配置项，并在对应文章的 Front-matter 中写上 password 的键和加密后的密文即可。

请注意：为了保证密码原文不会被泄露到网页中，文章的密码必须是通过 SHA256 加密的，这样就不会被破解。

verifyPassword:
  enable: true
  promptMessage: 请输入访问本文章的密码
  errorMessage:  密码错误，将返回主页！

如何一键部署hexo

通过 hexo-deployer-git 插件可以实现一键将博客同时部署到多个 git 仓库中。如同时发布到 github 及 gitee 提供的 pages 服务。安装：

npm install hexo-deployer-git --save

修改 Hexo 根目录下的 _config.yml 文件中的如下内容:

## Docs: https://hexo.io/docs/deployment.html
deploy:
  - type: git
    repo: https://github.com/lxl80/blog.git
    branch: gh-pages
    ignore_hidden: false
  - type: git
    repo: https://gitee.com/lxl80/lxl80.git
    branch: master
    ignore_hidden: false

也可以如本站一样，采用 hexo-deployer-cos-enhanced 插件将静态内容部署到腾讯云对象存储服务中，在 DNS 配置中将境内线路解析到腾讯云 CDN 地址，实现加速。部署完成后会自动刷新被更新文件的 CDN 缓存。

安装：

npm install hexo-deployer-cos-enhanced --save

_config.yml 配置如下:

deploy:
  - type: git
    repo: https://github.com/lxl80/blog.git
    branch: gh-pages
    ignore_hidden: false
  - type: cos
    bucket: lxl80-130****
    region: ap-beijing
    secretId: AKIDh9****F8FvL
    secretKey: Z3IGiur****QZR3PgjXmlVg
    cdnConfig:
      enable: true
      cdnUrl: https://static.lixl.cn
      bucket: static-130****
      region: ap-beijing
      folder: static
      secretId: AKIDh9****F8FvL
      secretKey: Z3IGiur****QZR3PgjXmlVg

然后通过 hexo g -d 即可实现一键发布，并更新 CDN 缓存。

文章链接转静态短地址（可选的）

如果文章名称是中文的，那么 Hexo 默认生成的永久链接也会有中文，这样不利于 SEO，且 gitment 评论对中文链接也不支持。我们可以用 hexo-permalink-pinyin Hexo 插件生成文章时生成中文拼音的永久链接，或者用hexo-abbrlink 生成静态文章链接。以下结合 hexo-abbrlink 生成类似 /yyyy/mmdd+随机数.html 的文章链接地址。

安装命令如下：

npm install hexo-abbrlink --save

npm下载太慢怎么办？修改国内淘宝源加速，戳

在 Hexo 根目录下的 _config.yml 文件中，修改 permalink: ，并在文件末尾新增 abbrlink:配置项：

permalink: :year/:month:day:abbrlink.html

abbrlink:
  alg: crc16 #算法选项：crc16丨crc32
  rep: dec #输出进制：dec为十进制，hex为十六进制

添加 emoji 表情支持（可选的）

Matery主题新增了对 emoji 表情的支持，使用到了 hexo-filter-github-emojis 的 Hexo 插件来支持 emoji 表情的生成，把对应的 markdown emoji 语法（::, 例如：:smile:）转变成会跳跃的 emoji 表情，安装命令如下

npm install hexo-filter-github-emojis --save

npm下载太慢怎么办？修改国内淘宝源加速，戳

在博客根目录下的 _config.yml 文件中，新增以下的配置项：

githubEmojis:
  enable: true
  className: github-emoji
  inject: true
  styles:
  customEmojis:

执行 hexo clean && hexo g 重新生成博客文件，然后就可以在文章中对应位置看到你用 emoji 语法写的表情了。

文章字数统计插件

如果你想要在文章中显示文章字数、阅读时长信息，可以安装 hexo-wordcount插件。

安装命令如下：

npm i --save hexo-wordcount

然后只需在本主题下的 _config.yml 文件中，激活以下配置项即可：

wordCount:
  enable: false # 将这个值设置为 true 即可.
  postWordCount: true
  min2read: true
  totalCount: true

添加 RSS 订阅支持

本主题中还使用到了 hexo-generator-feed 的 Hexo 插件来做 RSS，安装命令如下：

npm install hexo-generator-feed --save

在 Hexo 根目录下的 _config.yml 文件中，新增以下的配置项：

feed:
  type: atom
  path: atom.xml
  limit: 20
  hub:
  content:
  content_limit: 140
  content_limit_delim: " "
  order_by: -date

执行 hexo clean && hexo g 重新生成博客文件，然后在 public 文件夹中即可看到 atom.xml 文件，说明已经安装成功了。

hexo-feed 这个RSS插件更加强大，支持分类订阅，标签订阅。但对hexo 6.x没有做支持，虽然在hexo6.x上面工作正常。

增加百度统计功能

首先注册百度统计站长版，登陆后点击新增网站，然后直接输入你的博客地址例如： https://blog.17lai.site，网站域名和网站首页都写这个，网站名称可以填我的博客，
行业类别：博客—空间周边。

然后点击左侧菜单的代码获取，找到

hm.src = "https://hm.baidu.com/hm.js?……"

问号后的这一段十六进制代码
复制下来，粘贴到主题配置文件中的baidu_analytics:后面，注意冒号和值之间要有一个空格，然后将该字段前面的#号删除代表启用此功能。保存后即可

# Add baidu analytics configuration
# 添加 baidu Analytics 配置
baiduAnalytics:
  enable: false # 开启时设置为true 并填写正确的id
  id: f614xxxxxxxxxxxxxxxx05d25e

Leancloud+Valine打造Hexo个人博客极简评论系统

Leancloud配置

首先访问Leancloud官网https://leancloud.cn/
有Github账号的小伙伴可以用Github账号进行登陆然后绑定邮箱就可以啦！
进入之后点击创建应用

这样我们就创建好啦！

接着点击应用右上角的设置进入设置界面

选择应用key，这样就可以看到我们接下来需要使用到的key

接着进入应用中心绑定你的个人博客域名

Valine配置

然后我们去主题配置文件中进行修改
主题配置文件路径：matery_config.yml
找到以下参数进行修改

# Valine.
# You can get your appid and appkey from https://leancloud.cn
# more info please open https://valine.js.org
valine:
  enable: true //打开valine评论功能
  appid: 你的leancloud appid 
  appkey: 你的leancloud appkey 
  notify: false //邮件提醒
  verify: true //评论时是否有验证码，需要在Leancloud 设置->安全中心 中打开
  placeholder: 说点什么吧！ //评论框默认显示
  avatar: hide //评论者的头像,我这里设置的不显示
  guest_info: nick # custom comment header
  pageSize: 10 # pagination size

PS：评论者头像可以进行如下设置

到此，一个极简评论系统就完成啦！

系列教程

全部文章RSS订阅

Hexo系列

HexoRSS分类订阅

[三万字教程]基于Hexo的matery主题搭建博客并深度优化完全一站式教程

markdown 各种其它语法插件，latex公式支持，mermaid图表，plant uml图表，URL卡片，bilibili卡片，github卡片，豆瓣卡片，插入音乐和视频，插入脑图，插入PDF，嵌入iframe

本博客所有文章除特別声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来源夜法之书 !

hexo docker matery npm

[三万字教程]基于Hexo的matery主题搭建博客并深度优化一站式完全教程 _

选择Hexo的理由？

写博客的重要性

Hexo系列

Hexo Docker环境使用篇

Docker 简介：

Docker 版 hexo 环境一键部署

hexo web 后台写作

hexon

hexo-editor

Qexo

ssh key 部署

SSH 进入docker

远程 SSH 访问Docker

自定义用户自动运行脚本

反向代理 Hexo Docker

docker compose 配置

nginx配置

Windows DNS修改

Linux DNS 修改

获取 SSL 证书

Centos 安装Docker

QNAP 安装Docker

群晖 安装 Docker

Hexo入门篇

Hexo 通用简明教程

前提

安装

升级

建站

启动网页服务

npm下载加速

安装淘宝镜像， 加速NPM

安装CNPM

Hexo 日常操作命令

hexo 目录结构说明

_config.yml

node_modules 和 package.json

scaffold

themes

source ， public 和 .deploy_git

常用命令

指令说明

简写指令

hexo版本升级

升级 Node

升级 Hexo

设置npm源的几种方式

原始源

方案: 使用nrm

方案: 改变全局的注册

方案: 在命令行里指定源

方案: 修改 ~/.npmrc

方案: 使用cnpm

Hexo基础配置篇

下载主题

切换主题

_config.yml 文件的其它修改建议

新建主题必备about、tags、404等页面

新建分类 categories 页

新建标签 tags 页

新建留言板 contact 页

新建友情链接 friends 页

新建关于我 about 页

新建404页

404页面美化

移植

放入js文件到主题中

导入404 js

编辑404.esj

新建友情连接 friends 页（可选的）

菜单导航配置

配置基本菜单导航的名称、路径url和图标icon.

二级菜单配置方法

文章 Front-matter 介绍

Front-matter 选项详解

最简示例

最全示例

新建文章模板修改

代码高亮

[三万字教程]基于Hexo的matery主题搭建博客并深度优化一站式完全教程

群晖安装 Docker

安装淘宝镜像，加速NPM

方案: 修改 `~/.npmrc`

`_config.yml` 文件的其它修改建议