博客配置指南

本博客基于 Hexo 建站，使用 Fluid 主题美化，并使用 GitHub Pages进行部署。

以下参考tequila-sunrise的博客 How to Create This Blog 并结合本人建站过程分享建站经验。

安装

  • Node.js Node.js 版本需不低于 10.13，建议使用 Node.js 12.0 及以上版本

  • Git

安装 Hexo

1
npm install -g hexo-cli

建站

新建项目

在项目目录下新建博客项目，其中项目名称用 <blog> 指代

1
2
3
hexo init <blog>
cd <blog>
npm install

项目配置

项目配置文件为 _config.yml，参数说明见官方文档 cn / en

以下是建议修改的参数，其中 <username> 为你的 GitHub 用户名

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
# Site
title:       # 网站标题
author:      # 作者
language:    # 网站语言设置，改变主题生成语言，默认en，简中zh-CN，本站采用en
timezone:    # 网站时区，例如America/New_York和UTC，大陆地区可选择Asia/Shanghai

# URL
url:         # 网址，本站采用GitHub Page进行部署，故填入https://<username>.github.io/

# Extensions
theme:       # 主题，填入fluid，后续会安装该主题

# Deployment
deploy:
  type: git
  repo: 
    github: https://github.com/<username>/<username>.github.io  # 后续会在GitHub上建立此项目

至此建站初步完成，接下来配置美化主题，我选用 Fluid 主题

主题

由于存在更新迭代的情况，本教程可能过时，推荐阅读官方开始教程 cn / en

安装主题

官方推荐两种安装方式，一为通过 npm 直接安装，二为下载最新 release 版本解压到 themes 目录；本文采取后者

首先移步 GitHub 下载 最新 release 版本

解压至 themes 目录，并将解压出的文件夹重命名为 fluid

创建 About 页

首次使用本主题，about 页需手动创建，在 <blog> 根目录下终端输入

1
hexo new page about

其中 new 表示新建，page 表示页，about 为 source 目录下新建文件夹的名字

修改 /source/about/index.md ，添加 layout 属性，解析时会按照 about 页的标准进行解析

1
2
3
4
5
6
7
---
title: about
date: <自动生成>
layout: about
---

<此处写 about 页的正文，支持 Markdown, HTML>

更新主题

更新主题前置准备，在博客目录下创建 _config.fluid.yml 文件，将主题的 _config.yml 内容复制迁移，以后如果修改任何主题配置，都只需修改 _config.fluid.yml 的配置即可，注意：

  • 只要存在于 _config.fluid.yml 的配置都是高优先级，修改原 _config.yml 是无效的
  • 每次更新主题可能存在配置变更，请注意更新说明，可能需要手动对 _config.fluid.yml 同步修改
  • 想查看覆盖配置有没有生效，可以通过 hexo g --debug 查看命令行输出
  • 如果想将某些配置覆盖为空，注意不要把主键删掉，不然是无法覆盖的，比如：
1
2
3
4
5
about:
  icons:  # 不要把 icons 注释掉，否则无法覆盖配置
    # - { class: 'iconfont icon-github-fill', link: 'https://github.com' }
    # - { class: 'iconfont icon-wechat-fill', qrcode: '/img/favicon.png' }
Copy

下面是更新流程：

  1. 将 theme 目录下的 fluid 文件夹全部删除，重新下载 release 并依照之前步骤解压
  2. 如果某些配置发生了变化（改名或弃用），release 的说明里会特别提示，同步修改原配置文件即可

自定义配置

具体参照 _config.fluid.yml 内注释进行，参数展开解释见官方配置指南 cn / en

部署

采用 GitHub Page 的方式进行部署

新建仓库

在 GitHub 新建 repo，命名必须为 <username>.github.io，不需要初始化任何文件，如 README LICENCE 等

安装插件

在 <blog> 根目录下终端输入

1
npm install hexo-deployer-git --save

而后执行以下命令，第一行会清除之前解析编译生成的文件，第二行 g 为 generate 缩写，d 为 deploy 缩写，表示编译生成文件后立即部署网站，关于 Hexo 所有的指令说明，详见官方文档 cn / en

1
2
hexo clean
hexo g -d

每次更新博客配置或内容后，都进行如上操作进行部署

本地可以预览部署效果，终端输入以下指令，s 为 server 缩写

1
2
3
hexo clean
hexo g
hexo s

写作

终端输入

1
hexo new draft <title>

新建草稿，随后在 source/_drafts 中找到 <title>.md ，创作完毕后发布草稿

1
hexo publish post <title>

其他指令请移步官方文档 cn / en

Hexo Fluid

本博客所有文章除特别声明外，均采用 CC BY-SA 4.0 协议 ，转载请注明出处！