用Github Pages展現你的項目

Github Pages

Github Pages,websites for you and your projects.
Hosted directly from your GitHub repository. Just edit, push, and your changes are live.

Github Pages，讓用戶可以自定義項目首頁，同時，讓其編寫的網頁可以經過域名訪問直接展現出來。Github Pages被看成是用戶編寫的、託管在github上的靜態網頁，Github提供了必定的空間供開發者存放靜態網頁。

Github Pages類型

1. User/Organization Pages（我的或公司站點）

   • 這種類型的Pages經過新建一個倉庫創建，以本身的用戶名命名，且每一個用戶名只能創建 一個；

   • 倉庫主幹（master）上內容被用來構建和發佈頁面

   • 多用於創建我的博客

2. Project Pages 項目站點

   • 這種類型的倉庫經過修改項目的Setting創建，一個項目只能創建一個；

   • 倉庫新建了一個gh-pages分支用於構建和發佈頁面；

   • 多用於展現項目效果

而此次咱們要講的就是Project Pages（項目站點），過程十分簡單，10分鐘搞定。

Project Pages

操做

1. 進入項目倉庫，點擊Settings：
   

2. 在Options選項右側，有一Panel爲Github Pages，點擊Launch automatic page generator：

3. 設置參數：name、tagline、body。
   body爲首頁內容（爲第6點所示），支持markdown語法：

4. 選擇首頁模板，不一樣模板，展現效果不一樣：
   

5. 建立pages成功，在settings頁面可看到page域名，可經過此域名訪問你的page：
   

6. 剛剛選擇的是默認模板，訪問域名http://ferunner.github.io/IFE/後效果如圖：

7. 那麼，如何自定義本身想要的頁面樣式呢？
   去往code界面，你會發現分支下多了個gh-pages分支，這是剛剛生成page後自動建立的分支，用於管理（構建和發佈頁面）Project Page：

8. 進入gh-pages分支，可往分支增刪文件，以實現本身想要的效果：
   

9. 那麼，克隆該倉庫到本地，切換到gh-pages分支。
   在這裏，我新增了t_1.1和t_1.2兩個文件夾，裏面均放着對應的html和css文件。推送到遠程倉庫，更新文件。

10. 進入遠程倉庫：

11. 訪問http://ferunner.github.io/IFE/t_1.1/t_1.1.html，便可看到你要展現的html頁面：

自此，你的項目的Project Page算是完成。若要更改首頁效果，則更改gh-pages分支下的index.html文件及樣式文件。