Github搭建個人部落格（2018最新版,親測）
##（一）前言：
建議：慢慢看,也就這一篇用心了點寫
說來話長，一把辛酸淚，可算是弄好了。
1 起因：在很早很早，大一的時候，估計快記不得日子了，那時候來到PC吧創業團隊，一個大一級的學長通過買原始碼建立了一個社群論壇，因為那時候的社群比較流行，學長讓我們註冊個賬號，發個心情，然後加個積分，再升個等級，常來逛逛，呵呵，好滿足的感覺。從那以後，我就想著是否有一天我也可以做出讓身邊的小夥伴都來觀摩一下我的網站。
2 沒想到的是，這一想就想了9年之久，一干就幹了快十年，這次終於可以很難勉勉強強的對學長們說：諾，歡迎來到我的部落格小屋，如果你想了解我，那麼請你翻到底吧，（kidding.gif）
逗比的話，就那麼點，生活中的我也是很逗比，但是更是一個愛學向上的騷年，悶騷而不失態。
#####好吧，我要開始幹活了。
我的各大blog：
可能你們會想，寫個部落格就寫個部落格唄，為什麼還裝這麼低階的A，弄三個出來，老實回答你們吧，我™我也不想啊，
- 我怕哪一天3.我的單純網站 掛了，因為3是用的阿里雲買的域名，花錢的額，要是哪天我沒錢了，或者域名解析出錯， 那不就掛了嘛，畢竟我已經掛掉一個域名了，現在還沒修好，我才用了一個禮拜沒出頭啊，蛋蛋的憂傷。
- 1.國外的GIthub地址，現在是因為天朝，訪問速度可能更不上，可能網路訪問速度慢些，但是，我依舊是很喜歡Github的，畢竟我感覺，裡面有很多Object讓我happy，所以Github這個就不算是備胎，真正的備胎是:
- 2.國內的Github地址：碼雲 ，此碼雲非彼
馬雲， 把它當做備胎無非就一點，國內伺服器，訪問網路速度快一些，其他的，我也不知道，第一次知道。
現在上幾張成果圖，呵呵，使用的輪子真高(滑稽.gif):
##（二） 關於我的部落格
（1）Home頁：
（2） 分類與標籤頁：
（3）單個文章的編輯日期，作者，分類，標籤，檢視更多
（4）頂部Tab欄
（5）底部分頁，訪客量統計，回到頂部按鈕
（6）部落格詳情頁
以上就是整個部落格的頁面，其實這個部落格也是後來發現的，一位比較低調的阿里前端哥哥擼出來的，且一直在維護中的Blog。
##（三） 其他部落格型別
型別一：
型別二：
型別三：
型別四：
型別五：
暫且就這麼多吧，型別一是現在大多數ITer 常用的個人部落格型別，Hexo強力驅動，雖然我到現在也不知道Hexo跟Jekyll有什麼不同的區別
##（四）搭建部落格辛酸shift
- 前面的坑
能成功搭建成這篇部落格是根據型別三：柏熒的部落格進行搭建的，但是又不是很喜歡那樣的介面，畢竟我這對前端能懂個屁的味道就很不錯了，於是在部落格三的基礎上進行進行部落格五的Fork歷程，
可誰知道部落格五上傳的程式碼不全，提供的搭建部落格教程卻沒有，一臉懵逼臉，在這裡我能說部落格五是在部落格四的基礎上進行個性化設定的嗎？部落格四是位鵝哥哥，部落格五我現在看來，實現的功能應該不算多，可能是多了個網易音樂播放的位置吧，
當時硬是不想使用柏熒的部落格，對TGOYO的部落格有感覺些，於是，找啊找，找到了浩陽貓哥哥的部落格，離我也就5Km不到的廠子裡面工作的路人。
於是：我索性跟著部落格Fork下來進行個人部落格的修改
- 路上的風景
- 註冊一個Github賬號 or 碼雲賬號
- Fork（拉取）我的部落格模板
在Github上搜索：xudailong.github.io 進入到我的倉庫中
可能你已經進入到了這個頁面，那麼接下來我們要進行的操作。
點選紅色的Fork後，就可以變成我們自己的倉庫了。
Fork成功後，就成我們自己的名下了，這時候，我們需要進行部落格的簡單設定。
找到Settings點選，進行頁面的設定。
這裡我們找到Rename下的前面的框內的內容，我們要改成與我們自己的github一樣的；使用者名稱，這裡我已經改過了，一定要記得使用者名稱與倉庫名要一致，就是兩處畫紅線的地方。
當rename完後，我們在當前頁面往下拉，直到出現GitHub Pages：
這裡有一句話：
好了，現在就能正常的訪問剛剛我們Fork過來的頁面，此時你的部落格地址應該是：xxx.github.io
xxx 是你的Github使用者名稱*
當你在瀏覽器的新視窗輸入：xxx.github.io
此時能就能訪問到你的部落格了，但是你的部落格裡面依舊顯示是我的部落格內容，所以，接下來，我們進行部落格的修改。
（五） 將部落格修改成自己的部落格
（1）先說個概念，現在的github個人搭建部落格方式有兩種，
我們現在用Git工具將整個專案Git clone下來，可以看一下現在的目錄結構：
這裡進行一下各個檔案（夾）的用途
- _config.yml ：全域性配置檔案
- posts :放文章的資料夾
其他的資料夾是各頁面的HTML檔案，你可以點進去看看，嘗試改變一下
其中：_config.yml 檔案中：
# Welcome to Jekyll!
#
# This config file is meant for settings that affect your whole blog, values
# which you are expected to set up once and rarely need to edit after that.
# For technical reasons, this file is *NOT* reloaded automatically when you use
# 'jekyll serve'. If you change this file, please restart the server process.
# Site settings
title: 徐代龍的技術專欄
brief-intro: Android and Python Coder
baseurl: "" # the subpath of your site, e.g. /blog
url: "https://643435675.github.io" # the base hostname & protocol for your site
permalink: /:year/:month/:day/:title/
# other links
twitter_username: #gaohaoyang126
facebook_username: #gaohaoyang.water
github_username: 643435675
email: [email protected]
weibo_username: 3115521wh
zhihu_username: hll643435675
linkedIn_username: gaohaoyang
dribbble_username:
description_footer: 來自徐代龍的個人專欄！
# comments
# two ways to comment, only choose one, and use your own short name
# 兩種評論外掛，選一個就好了，使用自己的 short_name
duoshuo_shortname: #hygblog
disqus_shortname: #gaohaoyang
# statistic analysis 統計程式碼
# 百度統計 id，將統計程式碼替換為自己的百度統計id，即
# hm.src = "//hm.baidu.com/hm.js?xxxxxxxxxxxx";
# xxxxx字串
baidu_tongji_id: 1cc1fc4b4b456bf7c99ce80aec5bf009
google_analytics_id: UA-72449510-4 # google 分析追蹤id
# Build settings
markdown: kramdown
kramdown:
input: GFM
syntax_highlighter: rouge
# port
# port: 1234
# url
category_dir: category/
tag_dir: tag/
# excerpt
excerpt_separator: "\n\n\n\n"
# paginate
plugins: [jekyll-paginate]
paginate: 6
port: 4001
你可以一邊修改一邊進行除錯，
# paginate
plugins: [jekyll-paginate]
paginate: 6
port: 4001
paginate中paginate的6為每頁顯示6篇文章，port：4001 是jekyll啟動埠號，
# statistic analysis 統計程式碼
# 百度統計 id，將統計程式碼替換為自己的百度統計id，即
# hm.src = "//hm.baidu.com/hm.js?xxxxxxxxxxxx";
# xxxxx字串
baidu_tongji_id: 1cc1fc4b4b456bf7c99ce80aec5bf009
google_analytics_id: UA-72449510-4 # google 分析追蹤id
這裡進行了百度統計與谷歌統計，只要替換一下統計id就可以成為你自己的id了。
（2）使用Jekyll修改靜態部落格
請務必走完，因為上面這部落格講的很清楚，很詳細，環境搭建好，剩下的就簡單了。
我再簡明一下步驟：
一 ：安裝Ruby
二 ：安裝RubyGems
三：用RubyGems安裝Jekyll
四：cd到部落格資料夾，開啟伺服器
五：訪問 http://localhost:4000/
六：提交程式碼到遠端GitHub上
我按照上面的教程走完，大概步驟是這樣子的：
[email protected]pencer-it1 MINGW64 /f/myself/643435675.github.io (master)
$ gem install jekyll
Successfully installed jekyll-3.6.2
Parsing documentation for jekyll-3.6.2
Done installing documentation for jekyll after 2 seconds
1 gem installed
[email protected]-it1 MINGW64 /f/myself/643435675.github.io (master)
$ jekyll s
Configuration file: F:/myself/643435675.github.io/_config.yml
Source: F:/myself/643435675.github.io
Destination: F:/myself/643435675.github.io/_site
Incremental build: disabled. Enable with --incremental
Generating...
done in 5.499 seconds.
Please add the following to your Gemfile to avoid polling for changes:
gem 'wdm', '>= 0.1.0' if Gem.win_platform?
Auto-regeneration: enabled for 'F:/myself/643435675.github.io'
Server address: http://127.0.0.1:4001/
Server running... press ctrl-c to stop.
[email protected]-it1 MINGW64 /f/myself/643435675.github.io (master)
$ jekyll serve
Configuration file: F:/myself/643435675.github.io/_config.yml
Source: F:/myself/643435675.github.io
Destination: F:/myself/643435675.github.io/_site
Incremental build: disabled. Enable with --incremental
Generating...
done in 2.859 seconds.
Please add the following to your Gemfile to avoid polling for changes:
gem 'wdm', '>= 0.1.0' if Gem.win_platform?
Auto-regeneration: enabled for 'F:/myself/643435675.github.io'
Server address: http://127.0.0.1:4001/
Server running... press ctrl-c to stop.
最後是提交到github上面：
可以參照這一篇文章：
git 提交程式碼到github上
最後部落格就這樣子搭建完了，至於域名解析的話，還有把部落格搭建在碼雲上，這裡可以自己去摸索。
（3）域名解析的情況：
這篇只是說對了部分，理應域名解析是不把值直接用github的伺服器地址值進行設定的，因為我這裡面試過了，他有可能會變，在公司跟在自己的電腦ping的是不一樣的地址，有的情況可能會遇到域名解析失敗的情況，這裡一定要先實名認證了，然後再做其他操作才不會出現域名解析失敗的情況 ，當然你可以看一下這篇文章，可能會稍微懂一些：
註冊局設定暫停解析（serverHold）
下面就寫完了，這對於很小白的我都可以做出來，如果你想弄一個的話，你覺著你行不行呢？
（o(￣︶￣)o）