Hexo 双分支部署指南:从原理到 Netlify 实战
Hexo 双分支部署指南:从原理到 Netlify 实战在 Hexo 博客部署中,很多人会困惑于hexo d自动部署与 GitHub 手动提交的区别,以及如何通过双分支结构优雅地部署到 Netlify。本文将清晰拆解两种部署方式的核心差异,并手把手教你用双分支策略实现 Netlify 部署,兼顾源码安全与静态文件发布需求。 一、核心概念:hexo d与 GitHub 手动提交的区别简单说,两者的本质是操作对象和目标分支的不同,具体区别如下: 维度 hexo d(自动部署) GitHub 手动提交(git push) 操作对象 仅处理public文件夹(静态文件:HTML/CSS/JS 等) 处理 Hexo 源码(source文章、themes主题、_config.yml配置等) 依赖配置 依赖_config.yml中的deploy字段(指定仓库和分支) 依赖 Git 基础命令(add/commit/push),无需特殊配置 分支用途 通常部署到静态文件分支(如gh-pages/netlify-pages) 通常...
Hexo+Butterfly 优雅配置音乐播放器
Hexo+Butterfly 优雅配置音乐播放器在博客中嵌入音乐播放器,能为访客营造更沉浸的阅读氛围。Hexo 搭配 Butterfly 主题时,借助 APlayer 和 Meting.js 可快速实现这一功能,无需复杂开发。本文将详细讲解配置流程、参数含义及实用技巧,帮你轻松打造专属音乐博客。 一、核心工具与原理配置音乐播放器需依赖两个关键工具,二者分工明确: APlayer:轻量级 HTML5 音乐播放器内核,负责渲染播放界面、控制播放逻辑(如暂停、切换歌曲); Meting.js:音乐平台 API 封装工具,支持直接调用网易云、QQ 音乐等平台的播放列表,无需自建音乐文件库。 工作流程:Meting.js 从音乐平台获取播放列表数据,APlayer 将数据渲染为可视化播放器,实现 “一键接入在线音乐” 的效果。 二、前置准备 环境要求: 已安装 Hexo 博客框架及 Butterfly 主题(建议使用最新版本,兼容性更好)。 若未安装主题,可参考 Butterfly 官方文档 完成部署。 获取音乐资源 ID: 以网易云音乐为例,打开目标播放列表,URL 中 i...
Hexo 中 Butterfly 主题修改字体大小教程
Hexo 中 Butterfly 主题修改字体大小教程在使用 Hexo 搭建博客并采用 Butterfly 主题时,有时我们需要根据自己的阅读习惯调整字体大小,下面就来介绍具体的修改方法。 找到配置文件首先,我们需要找到字体大小设置所在的文件,路径为: 1\node_modules\hexo-theme-butterfly\source\css\var.styl 可以通过文件管理器导航到该路径,也可以在博客的开发工具中直接定位到这个文件。 修改字体大小参数打开var.styl文件后,我们会看到关于字体大小的配置代码: 1234// Global Variables$font-size = hexo-config('font.global_font_size') ? convert(hexo-config('font.global_font_size')) : 18px // 全局字体大小$code-font-size = hexo-config('font.code_font_size') ? convert(hex...
Hexo 常用命令使用和详解
Hexo 常用命令使用和详解Hexo 作为一款高性能的静态博客框架,其命令行工具设计简洁却功能强大。无论是新手搭建第一个博客,还是老手批量管理内容,掌握核心命令都是提升效率的关键。详细解析 Hexo 常用命令的用法与技巧。 一、内容管理:文章与页面的创建与发布1. 创建文章(默认布局为 post)1hexo new "文章标题" # 等价于 hexo new post "文章标题" 生成路径:source/_posts/文章标题.md Markdown 头部信息(Front-matter):自动生成包含标题、日期、标签等元数据的头部,例如: 123456---title: 文章标题date: 2025-08-10 15:30:00tags:- Hexo--- 2. 创建独立页面(如关于页、分类页)1hexo new page "页面名称" # 如 hexo new page "about" 生成路径:source/页面名称/index.md ...
在 Hexo 博客中插入图片的完整指南
在 Hexo 博客中插入图片的完整指南Hexo 是一个基于 Node.js 的静态博客生成器,因其灵活性和扩展性而广受欢迎。然而,在使用 Markdown 编写博客时,插入图片可能会遇到路径问题或格式限制。本文将详细介绍如何在 Hexo 中插入图片的多种方法 一、插入图片的三种种方法方法 1:使用文章资源文件夹(推荐)Hexo 提供了一个 post_asset_folder 功能,允许为每篇文章创建独立的资源文件夹。修改 Hexo 根目录下的 _config.yml 文件: 1234post_asset_folder: truemarked: prependRoot: true postAsset: true 说明:此配置会为每篇新文章自动生成一个与文章同名的文件夹,用于存放图片等资源。 创建新文章: 1hexo new "你的文章标题" 这会在 source/_posts/ 目录下生成一个同名文件夹(如 你的文章标题)和 .md 文件。 存放图片:将图片放入生成的文件夹中(例如 source/_posts/你的文章标题/)。 插入图片:...
Hexo使用Butterfly主题配置页脚网站运行实时时间
Hexo使用Butterfly主题配置页脚网站运行实时时间一、找配置文件寻找/node_modules/hexo-theme-butterfly/layout/includes/footer.pug文件,添加完之后已经成功了,但是在左下角 里面的代码直接全部替换为 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566- const { nav, owner, copyright, custom_text } = theme.footerif nav .footer-flex for block in nav .footer-flex-items(style=`${ block.width ? 'flex-grow:' + block.width : ''...