Hexo博客搭建与美化系列教程（一）：基础搭建与部署

一、环境准备

  1. 安装Node.js

• Node.js是运行Hexo的基础环境。访问 Node.js官网，根据你的操作系统下载对应的安装程序。

• 安装完成后，打开命令行工具（Windows用户可按 Win + R，输入 cmd 回车打开命令提示符），输入以下命令检查是否安装成功：
node -v
2. 安装Git

• Git用于版本控制和部署博客。进入 Git官网，下载适合你系统的版本。

• 安装过程中可使用默认设置。安装完成后，同样在命令行中输入以下命令检查安装情况：
git –version
3. 配置Git和GitHub

• 配置用户名和邮箱
在命令行中输入以下命令，将 <你的用户名> 和 <你的邮箱> 替换为实际信息：
git config –global user.name “你的用户名”
git config –global user.email “你的邮箱”
• 生成SSH密钥并配置到GitHub

  1. 生成SSH密钥对，在命令行中输入以下命令，将 <你的邮箱> 替换为你注册GitHub使用的邮箱：
    ssh-keygen -t rsa -C “你的邮箱”
    生成过程中一路回车使用默认设置即可。

  2. 找到生成的公钥文件。在Windows系统中，公钥文件通常位于 C:\Users\你的用户名.ssh\id_rsa.pub。用记事本打开该文件，复制其中的内容。

  3. 登录GitHub，点击右上角头像，选择 Settings，再选择 SSH and GPG keys，点击 New SSH key，在 Title 处可随意填写一个名称，将复制的公钥内容粘贴到 Key 文本框中，然后点击 Add SSH key。

  4. 测试连接是否成功，在命令行中输入：
    ssh -T git@github.com
    首次连接会提示是否继续，输入 yes。如果看到类似 Hi 你的用户名! You’ve successfully authenticated, but GitHub does not provide shell access. 的信息，则表示连接成功。

  5. 创建GitHub仓库

• 登录GitHub，点击右上角的 + 按钮，选择 New repository。

• 仓库名称必须为 <你的用户名>.github.io（注意前缀必须为你的用户名），可见性选择 Public，然后点击 Create repository。

二、Hexo安装与初始化

  1. 安装Hexo

• 打开命令行工具，输入以下命令安装Hexo：
npm install -g hexo-cli
2. 初始化Hexo项目

• 创建一个新的文件夹用于存放博客项目（例如 D:\HexoBlog），在该文件夹内右键点击，选择 Open Git Bash here（如果使用的是Windows系统且安装了Git）。

• 在打开的 Git Bash 中输入以下命令初始化Hexo项目：
hexo init blog-demo
cd blog-demo
npm install
3. 本地运行Hexo

• 在命令行中输入以下命令启动本地服务器：
hexo s
• 打开浏览器，访问 http://localhost:4000，即可看到初始化后的Hexo博客页面。

三、Hexo部署到GitHub Pages

  1. 安装部署插件

• 在命令行中输入以下命令安装 hexo-deployer-git 插件：
npm install hexo-deployer-git –save
2. 配置部署信息

• 打开博客项目根目录下的 _config.yml 文件，找到 deploy 部分，进行如下配置（将 <你的用户名> 替换为实际的GitHub用户名）：
deploy:
type: git
repository: git@github.com:<你的用户名>/<你的用户名>.github.io.git
branch: main
3. 部署到GitHub Pages

• 在命令行中输入以下命令进行部署（可缩写为 hexo cl; hexo g; hexo d）：
hexo clean && hexo generate && hexo deploy
• 部署过程中可能需要输入GitHub的用户名和密码。如果看到 Deploy done 的提示，则表示部署成功。

• 稍等片刻后，在浏览器中访问 https://<你的用户名>.github.io，即可看到部署后的博客页面。

Hexo博客搭建与美化系列教程（二）：主题美化与功能扩展

一、主题选择与安装

  1. 主题选择

• Hexo有众多主题可供选择，可根据个人喜好和需求挑选。本教程以安知鱼主题为例，其项目地址为 https://github.com/anzhiyu-c/hexo-theme-anzhiyu，官方文档在 https://docs.anheyu.com/initall.html。

  1. 主题安装

• 在博客根目录（即包含 _config.yml 文件的目录）下，打开命令行工具，输入以下命令安装主题：
git clone -b main https://github.com/anzhiyu-c/hexo-theme-anzhiyu.git themes/anzhiyu
• 由于该主题使用了 pug 和 stylus，首次安装需要安装对应的渲染器，在命令行中输入以下命令：
npm install hexo-renderer-pug hexo-renderer-stylus –save
二、主题配置

  1. 应用主题

• 打开 _config.yml 文件，将 theme 的值修改为 anzhiyu：
theme: anzhiyu
2. 覆盖配置

• 为了避免在主题更新时丢失自定义配置，需要进行覆盖配置操作。

• 如果是Linux系统，在命令行中输入以下命令：
cp -rf./themes/anzhiyu/_config.yml./_config.anzhiyu.yml
• 如果是Windows系统，则手动将 themes/anzhiyu/_config.yml 文件复制到根目录下，并将其重命名为 _config.anzhiyu.yml。

• 以后如果修改主题配置，都只需修改 _config.anzhiyu.yml 文件即可。需要注意的是，只要存在于 _config.anzhiyu.yml 的配置都是高优先级，修改原 _config.yml 中的主题相关配置是无效的。每次主题更新可能存在配置变更，请注意更新说明，可能需要手动对 _config.anzhiyu.yml 进行同步修改。可以通过 hexo g –debug 查看覆盖配置是否生效。

三、生成标签页和分类页

  1. 生成标签页

• 在命令行中输入以下命令生成标签页：
hexo new page tags
• 找到 source/tags/index.md 文件，打开并修改添加 type: “tags”，如下所示：

title: 标签
date: 2024-07-05 03:36:02
type: “tags”
comments: false
top_img: false

  1. 生成分类页

• 在命令行中输入以下命令生成分类页：
hexo new page categories
• 找到 source/categories/index.md 文件，打开并修改添加 type: “categories”，如下所示：

title: 分类
date: 2024-07-05 03:36:48
aside: false
top_img: false
type: “categories”

四、配置文章模版

  1. post.md模版

• scaffolds 目录下的 post.md 是新建博文的模版文件，其内容如下（仅供参考，可根据需要修改）