简介

GitHub Pages为我们提供了搭建网站的便利条件。它利用你的github repository作为网站源码,实时的根据你的开源仓库修改网页内容
在你的网站源码部署完毕后,你可以通过github自动分配的免费二级域名username.github.io 来访问你的仓库生成的网页。

当然,github还提供了搭建网站的基础框架,本篇博客我们就来一起看看如何利用github搭建自己的网站。

Hello, GitHub Pages!

  1. github上注册好自己的账号后,新建一个名为username.github.io的仓库。

    例如我的github账号名为ccandle,则我的github仓库名称为:ccandle.github.io

其他设置保持默认

之所以要这样起名,是因为github会将免费域名自动关联到该仓库上。如果想为仓库起一个别的名字,可以手动设置

由于我的ccandle.github.io已经被使用,本教程中我将使用githubpage这个repository

建立仓库

  1. 建立好后来到仓库页面,进入Settings
    点击settings
    翻到下面,选择主题
    settings里面点击选择主题
    选择一个你中意的主题

    如果你选择了不中意的主题,可能会导致学习动力不足,精神萎靡食欲不振等等症状

    选择主题
    此时跳转到的界面是github自动为你生成的网站index.md页面,单击commit changes提交。

  2. 回到Settings-GitHub Pages选项卡,如果你看到
    成功发布到网址

    则说明你的第一个github个人网站已经成功创建了

自动生成的示例网站界面

如果你的repository名是username.github.io,那么你应该可以通过这个域名访问你的主页了

  1. 如果你只是做一个简单的个人页面的话,根据你的需求修改一下index.md的内容之后,就可以发布自己的网站了

次级页面创建

如果我们有许多页面需要展示的话,仅仅有一个主页显然是不够的
我们可以通过在根目录下创建文件夹,在文件夹中创建index.md 的方式创建新的页面。

目录结构示例:

目录结构示例


具体页面创建方法以及示例项目源码,请见

https://github.com/CCandle/githubpage

手动设置GitHub Pages所指的Repository

将一个Repository作为静态页面访问,只需要在Repository的Settings-GitHub Pages选项卡中进行设置即可。

各配置详解:

  • Source:
    • Branch:页面所在分支,通常选择master分支
    • Folder:页面所在根目录,保持默认/(root)即可
  • Theme Chooser:
    • Theme Chooser:针对使用jekyll的页面,更改主题
  • Custom domain:
    • Custom domain:使用自己的域名,日后的blog会有详解。
  • Enforce HTTPS:
    • Enforce HTTPS:使用https协议传输,建议勾选

总结

本篇Blog中,我们学习到如何使用GitHub Pages来简单的搭建自己的个人网页。
但是显然,这样的网页是很粗糙的,作为自己的个人Blog 不 够 优 雅

下一篇Blog中,我将教大家如何使用Hexo搭建出一个较为完善的Blog页面。