前言
習慣自己寫Blog的朋友一定不會陌生wordpress,或許也曾在新浪部落格和QQ空間留過腳印,但靜心認真思考一下,似乎我們又總是嚮往更加簡單自由的寫作方式。GitHub給我們提供了一個無限的空間,我們需要珍惜使用,而Hexo的出現從某種意義上來說代替了Jekyll,讓我們可以更專注於寫作本身。本文主要介紹自己的實踐心得並不斷完善內容,衍生知識和原理推薦大家認真閱讀官網的手冊,其它推薦參考內容連結在文中也會標註出來。
喜歡寫Blog的人,會經歷三個階段:
第一階段,剛接觸Blog,覺得很新鮮,試著選擇一個免費空間來寫。
第二階段,發現免費空間限制太多,就自己購買域名和空間,搭建獨立部落格。
第三階段,覺得獨立部落格的管理太麻煩,最好在保留控制權的前提下,讓別人來管,自己只負責寫文章。
更新歷史
2015年09月03日 - 完善Windows 10安裝Hexo中的細節
2015年03月22日 - 更新Windows下Hexo 3.0安裝和升級,感謝@機智的阿卡林醬
2015年03月10日 - 增加Hexo 3.0降級 2.8
2014年12月19日 - 完善內容
2014年12月09日 - 更新Hexo配置修改部分
2014年06月19日 - 更新全部基礎架構,待完善配置修改部分
2014年06月17日 - 更新部分Hexo建站過程,待完善
2014年05月29日 - 撰寫初稿
擴充套件閱讀
Hexo Docs - http://hexo.io/docs/
HelloDog Index - http://wsgzao.github.io/index/#Hexo
準備工作
注意 本文主要針對Windows平臺和Hexo 3.x
瞭解Hexo
A fast, simple & powerful blog framework
Hexo 是一個快速、簡潔且高效的部落格框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在幾秒內,即可利用靚麗的主題生成靜態網頁。
hexo.io
安裝GIT
GitHub Windows
簡單可依賴,安裝完成後依據提示操作即可,So Easy
安裝Node.JS
Node.JS
注意 安裝完成後新增Path環境變數,使npm命令生效。新版已經會自動配置Path
- ;C:/Program Files/nodejs/node_modules/npm
安裝Hexo
配置好GitHub家目錄後,雙擊桌面上的Git Shell,輸入npm命令即可安裝
- npm install hexo-cli -g
- npm install hexo --save
- #如果命令無法執行,可以嘗試更換taobao的npm源
- npm install -g cnpm --registry=https://registry.npm.taobao.org
Hexo初始化配置
建立Hexo資料夾
安裝完成後,根據自己喜好建立目錄(如E:/kuaipan/GitHub/hexo),進入Git Shell切換到該路徑下E:/kuaipan/GitHub/hexo執行以下指令
- hexo init
- #安裝 Hexo 完成後,請執行下列命令,Hexo 將會在指定資料夾中新建所需要的檔案。
- $ hexo init
- $ cd
- $ npm install
- #新建完成後,指定資料夾的目錄如下
- .
- ├── _config.yml
- ├── package.json
- ├── scaffolds
- ├── scripts
- ├── source
- | ├── _drafts
- | └── _posts
- └── themes
安裝Hexo外掛
- npm install hexo-generator-index --save
- npm install hexo-generator-archive --save
- npm install hexo-generator-category --save
- npm install hexo-generator-tag --save
- npm install hexo-server --save
- npm install hexo-deployer-git --save
- npm install hexo-deployer-heroku --save
- npm install hexo-deployer-rsync --save
- npm install hexo-deployer-openshift --save
- npm install hexo-renderer-marked@0.2 --save
- npm install hexo-renderer-stylus@0.2 --save
- npm install hexo-generator-feed@1 --save
- npm install hexo-generator-sitemap@1 --save
本地檢視效果
繼續執行以下命令,成功後可登入localhost:4000檢視效果
- hexo server
Hexo 簡寫命令
- hexo n #new
- hexo g #generate
- hexo s #server
部署靜態網頁到GitHub
註冊設定GitHub
- 登入GitHub,註冊自定義使用者名稱如wsgzao
- 在主頁右下角建立New repository,name必須和使用者名稱一致如wsgzao.github.io
- 首次建立耐心等待10分鐘左右稽核,之後即可訪問靜態主頁如http://wsgzao.github.io
同步內容至GitHub
- 下載GitHub Windows
- 設定Local path如E:/快盤/GitHub/
- 執行Git Shell切換到如E:/快盤/GitHub/hexo路徑下
- 執行hexo g命令生成public資料夾
- 把生成的內容全部複製到Local path或其子目錄
- 執行GitHub確認修改資訊後執行右上角的Sync同步
- 最後訪問主頁觀察效果
https://pages.github.com/
域名和DNS
域名推薦
GoDaddy makes registering Domain Names fast, simple, and affordable.
【推薦理由】兩個字“靠譜”,支援支付寶,附優惠碼連結
http://www.godaddy.com/
http://www.gdcodecoupon.com/
DNS推薦
致力於為您提供最穩定、最安全的域名解析服務
【推薦理由】依然是兩個字“靠譜”,感謝他們一直以來對於公益的堅持
https://www.dnspod.cn/
設定CNAME
- 在Github的網站目錄下建立CNAME檔案
- 填寫自己的域名如hellodog.com,儲存結束
- 登入DNSPod,先新增域名,然後新增記錄,設定如下