博客使用方法记录

当然可以考虑 GitHub Pages!它是托管个人博客的免费、稳定且开发者友好的绝佳选择,尤其适合技术类博客或愿意学习 Git/Markdown 的用户。既然你之前尝试过但忘记了,下面带你一步步“复活”它,并补充关键细节:

🌟 GitHub Pages 建博客核心优势

✅ 完全免费
✅ 无需服务器(GitHub 托管)
✅ 极快的全球访问速度(CDN支持)
✅ 原生支持 HTTPS
✅ 完美配合静态生成器(Hexo, Hugo, Jekyll等)
⚠️ 限制:不支持后端语言(如 PHP),只能托管静态文件(HTML/CSS/JS)。

🗂️ 两种常见 GitHub Pages 博客实现方式

方案一:纯 HTML/CSS(最简)
创建仓库:

命名 <你的用户名>.github.io (必须!严格匹配格式)  
!https://i.imgur.com/lQlE1cF.png

上传文件:

克隆仓库到本地:git clone https://github.com/username/username.github.io

在仓库根目录创建 index.html (主页)

可添加子页面:about.html, style.css, 图片文件夹 /images
推送更新:

    git add .
git commit -m "创建博客"
git push origin main  # 或 master

访问网站:

https://<你的用户名>.github.io (5分钟后生效)

方案二:静态生成器 + GitHub Pages(推荐!自动化高效🔥)
以 Hexo 为例(速度快、插件丰富),也适用 Hugo/Jekyll。

🔧 步骤 1:环境准备(确保已安装)
工具 安装方式 验证命令

Git https://git-scm.com/ git –version
Node.js https://nodejs.org/ node -v & npm -v
Hexo 命令行安装:npm install -g hexo-cli hexo -v

🚀 步骤 2:本地初始化博客

创建博客文件夹并初始化

hexo init my-blog
cd my-blog

安装依赖

npm install

启动本地预览(访问 http://localhost:4000)

hexo server

🎨 步骤 3:更换主题(可选但推荐)
https://hexo.io/themes/ 选主题(如:https://github.com/fluid-dev/hexo-theme-fluid)

克隆主题到 /themes 文件夹:

    git clone https://github.com/fluid-dev/hexo-theme-fluid.git themes/fluid

修改站点配置文件 _config.yml:

    theme: fluid  # 主题名对应文件夹名

📝 步骤 4:写新文章

hexo new “我的第一篇文章” # 在 /source/_posts 生成 .md 文件

用 Markdown 编辑内容(推荐 VS Code 或 Typora)

⚙️ 步骤 5:部署到 GitHub Pages
安装部署插件:

    npm install hexo-deployer-git --save

⚠️ 换电脑/云盘同步后恢复与部署注意事项

  1. 避免云盘同步带来的权限问题
    不要直接在 OneDrive、百度网盘等同步盘根目录下操作 Hexo 博客项目。遇到 public、.deploy_git 文件夹无法删除时,先关闭 Hexo,再用管理员权限手动删除这些文件夹。

  2. 主题安装后请删除 .git 文件夹
    克隆主题后,务必删除 themes/主题名/.git 文件夹,否则会导致 Git 嵌套仓库警告,影响后续提交和部署。

  3. 部署分支要和 GitHub 仓库一致
    _config.yml 里的 deploy.branch 要和你的 GitHub Pages 仓库分支一致(通常是 main)。

  4. 新电脑恢复流程

    • git clone 你的博客源码仓库
    • npm install
    • 检查并删除 themes/主题名/.git
    • hexo clean
    • hexo generate
    • hexo deploy
  5. 常见问题自查

    • 权限报错:手动删除 public/.deploy_git
    • 主题报错:删除 themes/主题名/.git
    • 部署失败:检查 deploy.branch 设置

修改站点配置 _config.yml:

    deploy:
  type: git
  repo: https://github.com/username/username.github.io.git
  branch: main  # GitHub默认主分支

一键部署:

    hexo clean 
    hexo deploy

首次会让你登录 GitHub 授权

🔗 步骤 6:(可选)绑定自定义域名
购买域名(如:阿里云/Cloudflare)

添加 DNS 记录:

记录类型 主机名 值
CNAME www username.github.io
A @ 185.199.108.153 (GitHub IP)

在仓库根目录建 CNAME 文件:

内容只写你的域名(如:example.com)

GitHub 仓库设置:

Settings > Pages > Custom domain 填入域名并启用 HTTPS

💡 关键问题自查(你上次卡在哪?)
问题现象 解决方案

404 页面不存在 检查仓库名是否是 username.github.io
样式丢失/CSS加载失败 检查主题配置的 URL 和文件路径
部署后内容未更新 运行 hexo clean && hexo deploy 强制刷新
自定义域名失效 确认 DNS 生效 + CNAME 文件存在
Git 推送权限错误 检查密钥配置或改用 HTTPS 仓库地址

📋 每日写作工作流
本地写文章:hexo new “标题”

Markdown 编辑器写作

本地预览:hexo server

满意后部署:

    git add .  # 提交源文件(可选,建议备份)
git commit -m "更新文章"
git push origin main

hexo deploy  # 生成静态页推送到GitHub Pages

🌈 进阶优化建议
SEO优化:安装 hexo-generator-sitemap 插件

评论系统:接入 https://giscus.app/(基于GitHub讨论)

持续集成:用 GitHub Actions 自动构建

图床加速:用 https://picgo.github.io/PicGo-Doc/ 管理图片

💪 现在就开始行动吧!
确认环境安装 → 2. 创建正确命名的仓库 → 3. 初始化博客项目

遇到问题直接查阅 https://docs.github.com/zh/pages 或静态生成器文档,大部分坑都有解决方案。你的博客正在等待重生!


博客使用方法记录
https://childofcuriosity.github.io/2025/06/09/博客使用方法记录/
Author
childofcuriosity
Posted on
June 9, 2025
Licensed under