我的第一篇博客
为什么搭建这个博客
作为计算机专业的研究生，一直希望能有一个属于自己的空间来记录学习笔记、
技术总结和日常思考。
技术选型
经过调研，最终选择了 Hexo + Butterfly 主题：
- 中文社区资源丰富
- 主题功能完善，设计优雅
- 部署到 GitHub Pages 方便快捷
未来计划
- 记录后端开发学习笔记
- 分享 AI 应用研发心得
- 整理日常学习资源
本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来源 Lay's Blog！
相关推荐
2026-05-08
外部链接安全跳转页面配置
前言博客中不可避免地会引用外部链接。默认情况下，点击外部链接会直接跳转到目标站点，用户没有任何心理准备。这存在两个问题： 用户体验 — 用户无法感知即将离开博客，容易产生困惑 安全风险 — 不熟悉的外部链接可能带来钓鱼或恶意网站风险 本文将实现一个外部链接安全跳转页面：用户点击任何外部链接后，先跳到一个中间提示页，展示目标地址和安全警告，确认后才跳转。效果类似 V2EX、知乎的外链跳转机制。 实现思路整体方案采用构建时重写 + 静态跳转页： Hexo Filter — 在 HTML 渲染完成后，通过 after_render:html 钩子扫描所有 <a> 标签，将外部链接重写为 /go/?url=<encoded_url> 静态跳转页 — 在 source/go/ 生成一个页面，通过 JS 解析 URL 参数，展示目标信息并实现跳转 样式隔离 — 通过内联 CSS 隐藏主题的导航栏、侧边栏等元素，使跳转页成为独立的全屏页面 这种方案是纯静态的，兼容 GitHub Pages 和 Vercel 等静态托管平台，无需服务器支持。 一、创建 H...
2026-05-08
Hexo文章加密功能配置
前言在搭建个人博客的过程中，有时候我们需要对某些文章进行加密保护，比如面试笔记、私人日记等敏感内容。本文将详细介绍如何使用 hexo-blog-encrypt 插件为 Hexo 博客添加文章加密功能，并实现按分类自动加密。 一、安装加密插件首先需要安装 hexo-blog-encrypt 插件： 1npm install hexo-blog-encrypt --save 安装完成后，插件会自动注册到 Hexo 的过滤器系统中。 二、基础配置2.1 站点配置在站点根目录的 _config.yml 文件中添加加密配置： 1234# hexo-blog-encrypt 文章加密配置encrypt: abstract: 本文已加密，请输入密码查看 wrong_pass_message: 密码错误，请重新输入 注意：配置字段名必须是 encrypt，而不是 hexo_blog_encrypt。 2.2 配置项说明 配置项 说明 默认值 abstract 加密文章显示的提示文字 “Here’s something encrypted…” wrong_pass_m...
2026-05-07
从零搭建Hexo博客完整指南
前言本文将详细介绍从零开始搭建一个基于 Hexo 的个人博客，并使用 Butterfly 主题进行美化的完整过程。Hexo 是一个快速、简洁且高效的博客框架，而 Butterfly 则是目前最受欢迎的 Hexo 主题之一。 一、环境准备1.1 安装 Node.jsHexo 是基于 Node.js 构建的，因此首先需要安装 Node.js。 访问 Node.js 官网 下载 LTS 版本 安装时勾选”Add to PATH”选项 安装完成后打开终端，验证安装： 12node -vnpm -v 注意: 推荐使用 Node.js 16.x 或更高版本，Hexo 8.x 需要 Node.js 14.0 以上。 1.2 安装 GitGit 是版本控制工具，也是部署博客到 GitHub Pages 的必要工具。 访问 Git 官网 下载对应系统版本 安装完成后验证： 1git --version 1.3 配置 GitHub 仓库 登录 GitHub 创建新仓库，仓库名格式：用户名.github.io 例如：username.github.io 注意: 仓库名必须与你...
2026-05-07
Butterfly搜索与自定义页面配置
前言除了常规的文章页面，博客还可以添加搜索功能和自定义页面来丰富内容。本文将介绍如何配置搜索功能，以及如何创建音乐、电影、友链等自定义页面。 一、搜索功能配置1.1 安装搜索插件首先需要安装 hexo-generator-search 插件来生成搜索索引文件： 1npm install hexo-generator-search --save 1.2 Butterfly 主题配置在 _config.butterfly.yml 中配置搜索功能： 12345678# 搜索search: use: local_search # 指定搜索引擎：local_search / algolia_search placeholder: 搜索文章... # 搜索框提示文字 local_search: preload: true # 页面加载时预加载搜索数据 top_n_per_article: 1 # 每篇文章显示的搜索结果数量 unescape: false # 是否转义 HTML 注意：必须使用 use 字段指定...
2026-05-07
Butterfly分类标签导航栏配置
前言默认的Butterfly主题在分类和标签页面没有导航栏，用户需要返回总页面才能切换到其他分类或标签。本文介绍如何通过JavaScript动态注入的方式，在具体分类/标签页面添加一个横向导航栏。 实现思路由于使用npm安装的Butterfly主题无法直接修改pug模板文件，采用以下方案： JavaScript动态注入 - 检测页面类型，动态创建导航栏 从侧边栏获取数据 - 利用侧边栏已有的分类/标签列表 CSS样式美化 - 添加导航栏样式和高亮效果 一、创建JavaScript脚本在 source/js/catalog-bar.js 创建脚本： 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104...
2026-05-08
音乐页面配置与播放器集成
前言在博客中嵌入音乐播放器可以让访客在阅读时享受音乐。本文将介绍如何利用 Butterfly 主题内置的 APlayer + MetingJS 支持，接入网易云音乐和QQ音乐的个人歌单，并通过自定义样式实现平台专属配色和优雅的卡片布局。 一、技术方案使用 Butterfly 主题内置的 APlayer + MetingJS 支持（无需额外安装播放器包），配合 hexo-tag-aplayer 插件提供 {% meting %} 标签语法： APlayer：HTML5 音乐播放器 UI MetingJS：客户端 JS 库，从音乐平台 API 拉取歌单元数据并渲染为 APlayer 播放器 hexo-tag-aplayer：Hexo 标签插件，提供 {% meting %} 标签语法，解决 <meting-js> 被 Markdown 渲染器过滤的问题 支持的平台：网易云音乐（netease）、QQ音乐（tencent）、酷狗（kugou）等。 二、安装与配置2.1 安装插件1npm install hexo-tag-a...
评论