于 Hexo + GitHub Pages 的搭建个人博客网站的详细教程

以下是快速搭建个人博客网站的详细教程,基于 Hexo + GitHub Pages 的免费方案,无需服务器和域名即可快速上线,适合零基础用户。


一、准备工作

  1. 注册GitHub账号

    访问 GitHub官网,注册账号。后续将通过GitHub Pages托管博客。

  2. 安装Git

    • Windows/Mac用户:从Git官网下载安装包,按提示安装。
    • 安装完成后,终端输入 git --version 验证是否成功。
  3. 安装Node.js

    • Node.js官网下载LTS版本安装包。安装完成后,终端输入 node -vnpm -v 检查版本。

二、安装并初始化Hexo

Hexo是一个基于Node.js的静态博客框架,支持Markdown写作,生成速度快。

  1. 安装Hexo

    终端执行以下命令:

    bash 复制代码
    npm install -g hexo-cli
    • 若因网络问题安装失败,可切换为国内镜像:

      bash 复制代码
      npm config set registry https://registry.npm.taobao.org
    • 安装成功后,输入 hexo -v 验证。

  2. 初始化博客项目

    bash 复制代码
    hexo init myblog  # 创建名为myblog的文件夹
    cd myblog
    npm install

三、配置博客基本信息

  1. 修改站点配置

    打开 myblog/_config.yml 文件,修改以下字段:

    yaml 复制代码
    title: 我的博客         # 博客标题
    subtitle: 记录技术点滴    # 副标题
    author: 你的名字         # 作者名
    language: zh-CN        # 语言
    timezone: Asia/Shanghai # 时区
  2. 更换主题(可选)

    • Hexo主题库选择主题(如Butterfly、Next)。
    • 终端执行 git clone 主题仓库地址 themes/主题名,然后在 _config.yml 中修改 theme: 主题名

四、创建并发布文章

  1. 生成新文章

    bash 复制代码
    hexo new "我的第一篇博客"
    • 文章Markdown文件位于 source/_posts 目录下,可编辑内容并添加Front-matter(如分类、标签)。
  2. 本地预览

    bash 复制代码
    hexo clean && hexo generate  # 生成静态文件
    hexo server                  # 启动本地服务
    • 访问 http://localhost:4000 查看效果。

五、部署到GitHub Pages

  1. 创建GitHub仓库

    • 仓库名必须为 用户名.github.io(如 AI-Green.github.io),选择Public可见性。
  2. 配置Hexo部署插件

    • 安装部署插件:

      bash 复制代码
      npm install hexo-deployer-git --save
    • 修改 _config.yml 文件末尾的部署配置:

      yaml 复制代码
      deploy:
        type: git
        repo: [email protected]:用户名/用户名.github.io.git  # 替换为你的仓库地址
        branch: main  # 分支名可能是main或master
  3. 部署到GitHub

    bash 复制代码
    hexo clean && hexo generate && hexo deploy
    • 完成后访问 https://用户名.github.io 即可看到在线博客。

六、进阶优化

  1. 绑定自定义域名

    • 在域名服务商(如阿里云)添加CNAME记录指向 用户名.github.io
    • 在博客的 source 目录下创建 CNAME 文件,写入域名(如 blog.example.com),重新部署。
  2. 加速国内访问

    • 同步部署到Gitee或Coding Pages,利用国内CDN加速。
  3. SEO优化

    • _config.yml 中设置关键词(keywords)。
    • 安装 hexo-generator-sitemap 插件生成站点地图。

常见问题

  • 部署失败 :检查SSH密钥是否配置(通过 ssh -T [email protected] 验证)。
  • 页面样式异常 :执行 hexo clean 清除缓存后重新生成。
  • 文章不显示:确认Markdown文件的Front-matter格式正确。

通过以上步骤,20分钟内即可完成个人博客的搭建。如需更个性化功能(如评论系统、数据分析),可参考Hexo插件库扩展。

相关推荐
lifeng432118 分钟前
在 CentOS 上将 Ansible 项目推送到 GitHub 的完整指南
centos·github·ansible
小华同学ai22 分钟前
千万别错过!这个国产开源项目彻底改变了你的域名资产管理方式,收藏它相当于多一个安全专家!
前端·后端·github
独立开阀者_FwtCoder4 小时前
一个 Cursor mdc 自动生成器,基于Gemini 2.5,很实用!
前端·javascript·github
我是哪吒4 小时前
分布式微服务系统架构第144集:FastAPI全栈开发教育系统
后端·面试·github
梓羽玩Python5 小时前
PDF解剖大师来了!LandingAI开源神器,这个Python库让百页文档秒变结构化数据!
python·github
网安刚哥6 小时前
我们开源了一款AI产品……
程序员·开源·github
Cynthia-石头9 小时前
Git Github Gitee GitLab
git·gitee·github
march of Time1 天前
go的工具库:github.com/expr-lang/expr
开发语言·golang·github
遇见火星1 天前
【运维实战】Rsync将一台主Web服务器上的文件和目录同步到另一台备份服务器!
运维·服务器·github·rsync
独立开阀者_FwtCoder1 天前
11 个 JavaScript 杀手脚本,用于自动执行日常任务
前端·javascript·github