技术博客全网最全 AnZhiYu 主题 Hexo 博客搭建教程
Tansuan classmate🌊 全网最全 AnZhiYu 主题 Hexo 博客搭建教程
AnZhiYu 是一款基于 Hexo 的高颜值博客主题,拥有动态效果、丰富组件、音乐播放器、首页卡片、分类标签、相册、朋友圈等功能,非常适合个人博客与技术网站。
🧰 一、环境准备
📦 1. 安装 Node.js
下载地址:
1
| https://nodejs.org/en/download
|
安装完成后打开终端输入:
如果显示版本号说明安装成功。
📦 2. 安装 Git
下载地址:
1
| https://git-scm.com/downloads
|
安装完成后测试:
🚀 二、安装 Hexo 博客
📥 1. 安装 Hexo CLI
打开终端输入:
📁 2. 创建博客
1 2 3
| hexo init blog cd blog npm install
|
▶️ 3. 启动博客
1 2 3
| hexo clean hexo g hexo s
|
浏览器打开:
即可看到博客。
🐟 三、安装 AnZhiYu 主题
📦 1. 下载主题
进入博客目录:
执行:
1
| git clone -b main https://github.com/anzhiyu-c/hexo-theme-anzhiyu.git themes/anzhiyu
|
⚙️ 2. 修改主题配置
打开:
找到:
改成:
📦 四、安装依赖
执行:
1
| npm install hexo-renderer-pug hexo-renderer-stylus --save
|
🚀 五、运行主题
1 2 3
| hexo clean hexo g hexo s
|
打开:
即可看到 AnZhiYu 主题。
📁 六、主题配置文件
复制主题配置:
1
| cp -rf ./themes/anzhiyu/_config.yml ./_config.anzhiyu.yml
|
Windows 用户直接复制文件即可。
🎨 七、配置网站信息
打开:
修改:
1 2 3 4 5
| title: Tim Blog subtitle: 热爱编程的14岁少年 description: 一个分享技术与生活的博客 author: Tim language: zh-CN
|
👤 八、设置头像
把头像放入:
例如:
然后打开:
修改:
1 2
| avatar: img: /img/avatar.jpg
|
🌈 九、首页顶部 Banner
📌 修改首页文字
1 2 3 4 5 6
| subtitle: enable: true sub: - 热爱编程 - 分享技术 - 热爱互联网
|
🖼 修改顶部背景图
1
| index_img: /img/banner.jpg
|
把图片放入:
🍔 十、菜单配置
1 2 3 4 5 6
| menu: 首页: / || anzhiyu-icon-house 归档: /archives/ || anzhiyu-icon-box-archive 分类: /categories/ || anzhiyu-icon-shapes 标签: /tags/ || anzhiyu-icon-tags 关于: /about/ || anzhiyu-icon-paper-plane
|
📱 十一、社交链接
1 2 3 4
| social: Github: https://github.com/你的用户名 || anzhiyu-icon-github Bilibili: https://space.bilibili.com/你的ID || anzhiyu-icon-bilibili Email: mailto:你的邮箱 || anzhiyu-icon-envelope
|
📝 十二、创建文章
✍️ 新建文章
文章位置:
📌 Markdown 示例
1 2 3 4 5 6 7 8 9 10 11 12 13
| --- title: 我的第一篇文章 date: 2026-05-17 cover: /img/banner.jpg tags: - 编程 categories: - 技术 ---
# Hello World
这是我的第一篇博客文章!
|
🖼 十三、文章封面
推荐图床:
文章顶部:
例如:
1
| cover: https://i.imgs.ovh/xxx.jpg
|
🎵 十四、音乐播放器
开启:
文章插入:
1 2 3 4 5
| <meting-js server="netease" type="song" id="123456"> </meting-js>
|
💬 十五、评论系统
推荐 Waline。
官网:
开启:
🌙 十六、深色模式
🔍 十七、本地搜索
1 2
| local_search: enable: true
|
安装:
1
| npm install hexo-generator-search --save
|
📊 十八、网站统计
📈 百度统计
📈 Google Analytics
1
| google_analytics: G-XXXXXXXX
|
🚀 十九、部署 GitHub Pages
📦 安装部署插件
1
| npm install hexo-deployer-git --save
|
⚙️ 配置部署
打开:
修改:
1 2 3 4
| deploy: type: git repo: https://github.com/你的用户名/仓库名.git branch: gh-pages
|
🚀 上传博客
1 2 3
| hexo clean hexo g hexo d
|
🌍 二十、自定义域名
GitHub 仓库:
1 2 3
| Settings → Pages → Custom domain
|
输入:
即可。
🖼 二十一、推荐封面图库
📸 Unsplash
📸 Pexels
📸 Pixabay
🔥 二十二、推荐插件
📦 Hexo AI 摘要
1
| npm install hexo-ai-excerpt
|
📦 代码复制按钮
📦 字数统计
1
| npm install hexo-wordcount --save
|
⚡ 二十三、常用命令
本地运行
清理缓存
生成静态文件
部署博客
🎉 二十四、总结
现在你已经拥有:
✅ Hexo 博客
✅ AnZhiYu 高颜值主题
✅ 评论系统
✅ 音乐播放器
✅ 搜索功能
✅ GitHub 部署
✅ 自定义域名
✅ Markdown 写作能力
你的博客已经接近专业级别了 🚀