如何將你的github倉庫部署到github pages（github.io博客）

 

詳細的git教程：http://www.cnblogs.com/tugenhua0707/p/4050072.html#!comments

 

做爲教程，很重要的一點就是要最大化的傻瓜化，本文將重新建一個github倉庫開始到成功部署github pages一步步解析。

第一步：新建一個github倉庫"hello-ghpages":

如今咱們有了一個空的倉庫，上面只有README.md和LICENCE文件，而且注意如今所在的分支是"master"。之因此強調這一點是由於接下來的步驟必須明確本身的github page在哪一個分支下面，這個等會兒再介紹。

第二步：點擊頁面右邊一列的「Settings」，跳轉到項目設置界面：

第三步：在設置界面咱們可以看到有一塊的標題是「Github Pages」，點擊這一塊上面的「Automatic page generator」按鈕：

第四步：在「New Project Site」頁面，須要注意的是頁面最下面的「tracking ID」。「tracking ID」的做用是使用Google的Analystics功能，該功能可以分析你的網站的訪問量等網站數據，能夠不填。若是須要使用該功能，能夠參考連接https://support.google.com/analytics/answer/1032385?hl=en。而後點擊「Continue to layout」按鈕。

第五步，設置主題，就可以發佈了：

這樣，咱們就可以經過連接：http://username.github.io/hello-ghpages/訪問咱們剛剛發佈的頁面了，其中username是你的github帳戶的名字。根據博主的經驗，第一次部署的話，等待的時間是比較長的，大概是十分鐘到十五分鐘左右。因此若是你立馬訪問剛剛發佈的頁面可能會出現404錯誤，不要着急慢慢等上十多分鐘，會獲得你想要的效果的：

到這一步，咱們已經完成了github pages的部署，可是在這個時候咱們面臨了兩個問題，第一：最初生成的倉庫只有兩個文件，不存在定義咱們如今看到的github pages樣式、內容的文件；第二，既然咱們沒有定義這些文件，而咱們看到的這些文件有必須是真實存在的，這些文件放在了哪裏？答案就涉及到咱們一開始提到的分支了。咱們在使用「Automatic page generator」功能的時候，github會自動在你項目的「master」分支下面新建一個「gh-pages」分支，而這個分支裏面的代碼定義了咱們剛剛看到的部署成功的github pages頁面的內容和樣式。

我想在這裏是有必要簡單介紹一下分支這個概念的。分支分紅兩種，一種是上面截圖中看到的，這種叫作遠程分支，另一種是咱們在使用Git進行版本控制的時候使用到的，叫作本地分支。在使用Git進行版本控制的時候，對於每一次提交，都會生成一個commit對象，這個commit對象包含了如下內容：　

• 提交信息元數據:包含了提交者、做者、提交時間等信息
• 一個包含指向 tree 對象（根目錄）的索引：在提交以前，Git 會先計算每個子目錄的校驗和，而後在 Git 倉庫中將這些目錄保存爲樹（tree）對象。commit對象中的這個索引指向了這個對象。參考一下《pro git》裏面的這張圖就能很好的理解了：

對於提交有了必定認識以後，分支就更好理解了，Git 中的分支，其實本質上僅僅是個指向 commit 對象的可變指針。結合實際，咱們來分析一下：在新建一個github倉庫的時候，從上面的圖咱們能夠看到，github會自動建立一個提交叫作「Initial commit」，同時新建了一個master分支，這個master分支是指向「Initial commit」提交對應的commit對象；在部署github pages的時候，github新建了一個分支，而且產生了一次提交「Create gh-pages branch via Github」。你能夠把上面的過程理解成下面幾條命令：

 git branch gh-pages    //在master分支下面新建一個gh-pages分支
 git checkout gh-pages    //切換到新建的gh-pages分支
 git rm -rf .        //因爲master分支和gh-pages分支裏面的內容徹底不一樣，因此首先清空了全部文件
 //在清空的文件夾裏面自定義新的文件,也就是上面截圖中看到的gh-pages分支中的文件
 git add .    //跟蹤本身定義的文件
 git commit -m "Create gh-pages branch via Github"    //提交本次修改

到目前爲止，你就以爲一個問題應該是如何將如今看到了github pages定義成我本身想看到的效果，這裏就須要用到Git了。

第六步：Clone遠程倉庫到本地：

第七步：clone下來默認爲master分支，因此咱們在文件夾裏面看到的是master分支對應的內容。而咱們須要編輯的是gh-pages分支，由於這個分支纔可以定義github pages的內容和樣式。咱們須要執行下面的命令：

上面的命令的意思是說，在本地新建一個分支，本地分支的名字叫作「gh-pages」，這個新建出來的分支是在遠程分支「origin/gh-pages」分支下面分化出來的，切換到新建出來的"gh-pages"分支，這個時候，咱們看到在文件夾"hello-ghpages"下面的文件時遠程分支"gh-pages"的內容了：

第八步：刪除裏面的全部文件，固然最好不要直接刪除，而是經過git命令，那樣會更加方便快捷。

第九步：目前爲止，這個文件夾是空的了，咱們在裏面新建一個index.html文件，在裏面定義一些內容，而且提交到當前分支。

第十步：提交到遠程分支，查看效果：

第十一步：查看效果吧，哈哈：

到這裏就大功告成了，嘿嘿。讓咱們來回顧一下，在整個教程中，咱們須要掌握的主要是如何將遠程分支分化到本地，而且自定義遠程分支的內容。上面的index.html是github pages的主頁，你能夠在這個基礎上慢慢擴充你須要顯示的內容，一切都和教程中展現的同樣。若是你有什麼問題或意見，歡迎在下面的評論中提出。

註明轉載地址：http://www.cnblogs.com/yuanzm/p/3945814.html