搭建 GitHub Pages
使用 GitHub Pages,免费搭建你的个人网站或博客
这是一个交互式课程,需要在 GitHub 上实际操作来完成学习。本页面为静态预览,方便您一次性阅读所有步骤内容。
前往 GitHub 开始学习 课程概览
GitHub Pages 可以将你的仓库直接发布为网站,自动读取 main 分支内容生成可访问的网站。配合 Jekyll 静态网站生成器,你可以轻松搭建博客。
目标人群新手、学生、项目维护者、小微企业
学习内容如何搭建并发布 GitHub Pages 网站(使用 Jekyll 静态网站生成器)
您将完成创建一个带博客功能的 GitHub Pages 网站
先决条件需了解分支、提交、拉取请求等基础概念
学习时长不到一小时
步骤 1
启用 GitHub Pages
GitHub Pages 可将仓库直接发布为网站,自动读取
main 分支内容生成可访问网站。实操环节
- 在仓库 Settings → Pages 中选择 "Deploy from a branch"
- 选择
main分支作为发布源 - 点击保存,首次部署约需 1 分钟
首次部署可能需要等待 1 分钟左右
步骤 2
自定义主页
index.md 是网站入口文件,修改提交后 GitHub Pages 会自动重新构建。实操环节
- 编辑
main分支下的index.md - 用 Markdown 语法编写首页内容
- 提交更改,等待自动重新构建
markdownindex.md 示例
# 我的个人网站
欢迎来到我的 GitHub Pages!
这里我会分享我的学习笔记和项目经验。步骤 3
配置网站
Jekyll 使用
_config.yml 统一管理网站设置,包括主题、标题、作者等。实操环节
- 在仓库根目录创建或编辑
_config.yml - 添加主题配置:
theme: minima - 可选:修改 title、author、description 等字段
- 提交更改
yaml_config.yml 示例
theme: minima
title: 我的博客
author: Your Name
description: 分享技术与生活步骤 4
发布第一篇博客文章
文章需按
_posts/YYYY-MM-DD-title.md 格式命名,且必须包含 front matter(含 title 和 date 字段)。实操环节
- 在
_posts目录下创建文件,命名为YYYY-MM-DD-my-first-post.md - 添加 front matter 配置
- 编写正文内容
- 提交并等待自动构建
markdown博客文章示例
---
layout: post
title: "我的第一篇博客"
date: 2026-07-23
---
这是我的第一篇 GitHub Pages 博客文章!文件名中的日期格式必须是 YYYY-MM-DD
front matter 必须包含 title 和 date
课程回顾
恭喜你顺利完成本课程!下面简单回顾一下你学到的内容:
- 启用了 GitHub Pages
- 通过配置文件设置了网站主题
- 了解了 Jekyll 目录结构与命名规范
- 发布了第一篇博客文章