Your Blog by Cloudflare Pages

Jekyll 博客上线指南：使用 Cloudflare Pages 免费托管

本教程是 JekyllCli 使用指南 的配套部署篇。

当你已经使用 JekyllCli 在本地初始化好了博客，并将其推送到个人的 GitHub 仓库后，接下来我们只需要使用永久免费的 Cloudflare Pages，就能让你的博客在全球极速上线，且支持后续的全自动更新。

第一步：连接你的 GitHub 仓库

1. 登录 Cloudflare 控制台（如果没有账号，使用邮箱免费注册一个）。
2. 在左侧菜单栏找到并点击 “Workers 和 Pages”。
3. 点击蓝色的 “创建 (Create)” 按钮，切换到 “Pages” 标签页。
4. 选择 “连接到 Git (Connect to Git)”。
5. 绑定你的 GitHub 账号，并在列表中选中你存放博客代码的仓库，点击 “开始设置”。

第二步：填写构建参数（重点）

在设置页面，Cloudflare 需要知道如何打包你的博客。请按以下标准填写：

• 框架预设 (Framework preset)：在下拉菜单中选择 Jekyll。
• 构建命令 (Build command)：保持默认的 bundle exec jekyll build 即可。
• 构建输出目录 (Build output directory)：保持默认的 _site 即可。

第三步：配置环境变量（⚠️ 核心避坑指南）

由于 Jekyll 是基于 Ruby 的框架，加上我们经常需要处理中文（如文章标题、标签），如果不配置正确的环境，极易出现中文乱码或构建报错。

在页面往下滚动，找到 “环境变量 (Environment variables)”，点击“添加”。请务必一字不差地添加以下 4 个变量：

类型	名称 (变量名)	值	作用说明
纯文本	JEKYLL_ENV	production	告诉 Jekyll 这是正式生产环境，优化打包速度
纯文本	LC_ALL	C.UTF-8	强制系统使用 UTF-8 编码，防止读取中文字符报错
纯文本	RUBYOPT	-E utf-8	强制 Ruby 运行环境使用 UTF-8 编码
纯文本	RUBY_VERSION	3.3	指定使用最新的 Ruby 3.3 版本，适配新版主题依赖

(对照检查：确保和下图一模一样)

第四步：一键部署 🚀

1. 检查上面配置无误后，点击页面最下方的 “保存并部署 (Save and Deploy)”。
2. 耐心等待 1~2 分钟，页面会显示构建日志。
3. 当出现绿色的 “成功 (Success)” 时，恭喜你，博客上线了！
4. 点击页面上方 Cloudflare 分配给你的专属域名（例如 your-blog-name.pages.dev），即可访问你的个人网站。

---

💡 后续日常更新

部署完成后，你后续写博客的体验将无比顺畅：

1. 依然使用 JekyllCli 在本地优雅地新建文章、插入图片。
2. 写完后，通过 Git 将改动推送到 GitHub。
3. 完成！不需要再登录 Cloudflare。 Cloudflare 只要检测到你的 GitHub 有新代码提交，就会在后台自动帮你重新打包部署网站。