教程分享
HEXO博客搭建第二期
00 分钟
2024-11-7
2024-11-8
type
status
date
slug
summary
tags
category
icon
password
HEXO主题有410种点击跳转

1. Git 安装

在博客根目录里安装最新版【推荐】：
plaintext
1
git clone -b main https://github.com/anzhiyu-c/hexo-theme-anzhiyu.git themes/anzhiyu

安装 Pug 和 Stylus 渲染插件

运行以下命令：
plaintext
1
npm install hexo-renderer-pug hexo-renderer-stylus --save

1.2. 使用主题

修改 Hexo 配置文件 _config.yml，将主题改为 anzhiyu。
plaintext
1
theme: anzhiyu

1.3. 覆盖配置

覆盖配置可将主题配置放置在 anzhiyu 目录之外，避免在更新主题时丢失自定义的配置。通过 Npm 安装主题的用户可忽略，其他用户建议学习使用。
  • macOS/Linux 在博客根目录运行：
plaintext
1
cp -rf ./themes/anzhiyu/_config.yml ./_config.anzhiyu.yml
  • Windows 用户复制 /themes/anzhiyu/_config.yml 到 Hexo 根目录，并重命名为 _config.anzhiyu.yml。
后续修改主题配置只需更新 _config.anzhiyu.yml。

注意事项

  • _config.anzhiyu.yml 中的配置优先级高于 _config.yml。
  • 每次更新主题时可能存在配置变更，请查看更新说明，并手动同步修改 _config.anzhiyu.yml。
  • 可通过 hexo g --debug 查看覆盖配置是否生效。
  • 若要将某些配置覆盖为空，注意不要删除主键。

1.4. 到这一步主题部署就完成了！别忘了推送更新上线

plaintext
1234
//本地预览hexo cl; hexo s//推送更新上线hexo cl; hexo g; hexo d

2 功能特性

2.1. 生成标签页和分类页

生成标签页：
plaintext
1
hexo new page tags
找到 source/tags/index.md 文件，添加 type: "tags"：
yaml
1234567
---title: 标签date: 2024-07-05 03:36:02type: "tags"comments: falsetop_img: false---
生成分类页：
plaintext
1
hexo new page categories
找到 source/categories/index.md 文件，添加 type: "categories"：
yaml
1234567
---title: 分类date: 2024-10-22 03:36:48aside: falsetop_img: falsetype: "categories"---
接下来，配置 _config.yml 和 _config.anzhiyu.yml 文件。

2.2 配置文章模板

/scaffolds 目录下有几个模板文件：
  • post.md：新建博文模板
  • page.md：新建标签页模板

post.md 模板示例

yaml
1234567891011121314151617181920212223242526272829303132
---title: {{ title }} #【必需】页面标题date: #【必需】页面创建日期updated: #【可选】页面更新日期tags: #【可选】文章标签categories: #【可选】文章分类keywords: #【可选】文章关键字description: #【可选】文章描述top: # 1 置顶top_img: #【可选】文章顶部图片comments: #【可选】显示文章评论模块(默认 true)cover: https://img.090227.xyz/file/ae62475a131f3734a201c.png #【可选】文章缩略图toc: #【可选】显示文章 TOCtoc_number: #【可选】显示 toc_numbertoc_style_simple: #【可选】显示 toc 简洁模式copyright: #【可选】显示文章版权模块copyright_author: #【可选】文章版权作者copyright_author_href: #【可选】作者链接copyright_url: #【可选】版权链接copyright_info: #【可选】版权声明文字mathjax: #【可选】显示 mathjaxkatex: #【可选】显示 katexaplayer: #【可选】加载 aplayer 的 js 和 csshighlight_shrink: #【可选】配置代码框是否展开aside: #【可选】显示侧边栏 (默认 true)swiper_index: 10 #【可选】首页轮播图配置top_group_index: 10 #【可选】首页右侧卡片组配置ai: #【可选】文章 ai 摘要background: "#fff" #【可选】文章主色---<div class="video-container">[视频内嵌代码]</div><style>.video-container { position: relative; padding-top: 56.25%; } .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>

page.md 模板示例

yaml
12345678910111213141516
---title: {{ title }} #【必需】页面标题date: #【必需】页面创建日期type: #【必需】标签、分类等updated: #【可选】页面更新日期comments: #【可选】显示页面评论模块description: #【可选】页面描述keywords: #【可选】页面关键字top_img: https://img.090227.xyz/file/ae62475a131f3734a201c.png #【可选】页面顶部图片mathjax: #【可选】显示 mathjaxkatex: #【可选】显示 katexaside: #【可选】显示侧边栏 (默认 true)aplayer: #【可选】加载 aplayer 的 js 和 csshighlight_shrink: #【可选】配置代码框是否展开top_single_background: #【可选】部分页面的顶部模块背景图片---

3 开启本地搜索

安装插件

安装 hexo-generator-search：
plaintext
1
npm install hexo-generator-search --save

设置主题配置文件

在配置文件中添加：
yaml
1234
local_search: enable: true preload: false CDN:
参数
解释
enable
是否开启本地搜索
preload
预加载，进入网页后自动加载搜索文件
CDN
搜索文件的 CDN 地址（默认使用本地链接）

个性化配置

修改网站图标：
  • 在线制作ico图标：链接
修改以下位置的 favicon.ico：
  • themes/anzhiyu/source/img/favicon.ico
  • .deploy_git/img
  • public/img
  • .deploy_git
替换为自己的图标，注意原图标大小。
将 themes/anzhiyu/source/img/siteicon/ 下的 32.png 和 16.png 替换为自己的图标，注意原图标大小。
保存后，运行以下指令更新：
plaintext
123
hexo clhexo ghexo d

4 新建文章

新建博文命令

plaintext
1
hexo new 这是一篇新的博文

文章置顶

安装插件

plaintext
1
npm install hexo-generator-topindex --save

设置置顶

在需要置顶的文章中添加 top 参数：
yaml
123456789
---title: 每天一个linux命令date: 2017-01-23 11:41:48top: 1categories:- 运维tags:- linux命令---
如果存在多个置顶文章，top 后的参数越大，越靠前。

添加任意文件

若想在网站根目录添加 ads.txt 文件，只需在 /source 文件夹下放置该文件即可。
更多请参考安之鱼主题官方文档：链接
上一篇
HEXO博客搭建第一期
下一篇
HEXO博客搭建第三期
目录