使用 GitHub Pages 创建静态页面的详细指南

什么是 GitHub Pages？

GitHub Pages 是由 GitHub 提供的一个免费的静态网站托管服务。它允许用户将 HTML、CSS、JavaScript 文件托管在 GitHub 仓库中，并直接通过 GitHub 的域名访问。

GitHub Pages 的特点

免费托管：用户可以免费使用 GitHub 提供的资源，托管个人、项目或组织的网站。
简单易用：GitHub Pages 使用简单，只需创建一个 GitHub 仓库即可开始。
支持自定义域名：用户可以将自己的域名与 GitHub Pages 绑定，实现个性化的网站。
支持 Jekyll：可以通过 Jekyll 创建更复杂的博客或网站。

如何创建 GitHub Pages 静态页面

第一步：创建 GitHub 仓库

登录你的 GitHub 账户。
点击右上角的 + 按钮，选择 New repository。
输入仓库名称，例如 username.github.io。
选择 Public，然后点击 Create repository。

第二步：上传网站文件

在你的仓库中，点击 Add file，然后选择 Upload files。
将你的 HTML、CSS 和 JavaScript 文件上传到仓库中。
确保你的首页文件名为 index.html，因为这是默认加载的文件。

第三步：访问你的 GitHub Pages

上传完成后，你可以通过 https://username.github.io 来访问你的网站。
注意将 username 替换为你的 GitHub 用户名。

使用 Jekyll 创建静态页面

什么是 Jekyll？

Jekyll 是一个静态网站生成器，广泛应用于 GitHub Pages。它可以帮助用户通过 Markdown 文件生成静态网页。使用 Jekyll，用户可以更轻松地管理和组织网站内容。

如何在 GitHub Pages 中启用 Jekyll

在你的仓库根目录下，创建一个名为 _config.yml 的文件。
在 _config.yml 文件中，添加你想要的配置，例如： yaml title: My Blog description: This is my personal blog.
创建一个名为 _posts 的文件夹，用于存放 Markdown 格式的文章。
使用 Jekyll 的语法撰写 Markdown 文件，文件命名规则为 YYYY-MM-DD-title.md。

自定义 GitHub Pages 主题

如何选择主题

GitHub Pages 提供多种主题供用户选择，你可以在 Settings > Pages > Theme 中找到这些主题。选择一个你喜欢的主题，点击应用即可。

如何自定义主题

你可以通过修改 CSS 文件来自定义网站样式。
也可以通过编辑 _config.yml 来修改主题配置，例如： yaml theme: minima

常见问题解答

GitHub Pages 适合什么类型的网站？

GitHub Pages 非常适合托管个人简历、项目展示、技术博客等静态网站。

是否可以使用自定义域名？

是的，你可以通过设置 DNS 和 GitHub 的相关配置，将你的自定义域名指向你的 GitHub Pages 网站。

GitHub Pages 有什么限制吗？

每个 GitHub 账户最多可以有一个 GitHub Pages 网站。
文件大小限制为 1GB，单个文件不超过 100MB。

如何更新我的网站？

只需在你的 GitHub 仓库中修改文件，提交更改后，网站会自动更新。

如何查看 GitHub Pages 的访问统计？

GitHub Pages 不提供内置的访问统计功能，你可以使用 Google Analytics 或其他分析工具来跟踪访问数据。

结论

GitHub Pages 是一个功能强大的静态网站托管解决方案，适合各类用户。通过简单的步骤，你可以轻松创建和管理静态页面。无论是个人项目还是专业网站，GitHub Pages 都能满足你的需求。