使用GitHub和Hexo搭建免費靜態Blog
前言
習慣自己寫Blog的朋友一定不會陌生Wordpress,或許也曾在新浪博客和QQ空間留過腳印,但靜心 認真思考一下,似乎我們又總是向往更加簡單自由的寫作方式。GitHub給我們提供了一個無限的空間,我們需要珍惜使用,而Hexo的出現從某種意義上來 說代替了Jekyll,讓我們可以更專注于寫作本身。本文主要介紹自己的實踐心得并不斷完善內容,衍生知識和原理推薦大家認真閱讀官網的手冊,其它推薦參 考內容鏈接在文中也會標注出來。
</blockquote>第一階段,剛接觸Blog,覺得很新鮮,試著選擇一個免費空間來寫。
第二階段,發現免費空間限制太多,就自己購買域名和空間,搭建獨立博客。
第三階段,覺得獨立博客的管理太麻煩,最好在保留控制權的前提下,讓別人來管,自己只負責寫文章。
更新歷史
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日 - 撰寫初稿閱讀原文 - http://wsgzao.github.io/post/hexo-guide/
擴展閱讀
- Hexo Docs - http://hexo.io/docs/
- HelloDog Index - http://wsgzao.github.io/index/#Hexo
</ul>
準備工作
注意 本文主要針對Windows平臺和Hexo 3.x
了解Hexo
A fast, simple & powerful blog framework
</blockquote>Hexo 是一個快速、簡潔且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在幾秒內,即可利用靚麗的主題生成靜態網頁。
hexo.io安裝GIT
簡單可依賴,安裝完成后依據提示操作即可,So Easy
安裝Node.JS
注意 安裝完成后添加Path環境變量,使npm命令生效
</tr> </tbody> </table> ;C:\Program Files\nodejs\node_modules\npm
安裝Hexo
配置好GitHub家目錄后,雙擊桌面上的Git Shell,輸入npm命令即可安裝
</tr> </tbody> </table> npm install -g hexo-cli npm install hexo --save
Hexo初始化配置
創建Hexo文件夾
安裝完成后,根據自己喜好建立目錄(如E:\kuaipan\GitHub\hexo),進入Git Shell切換到該路徑下E:\kuaipan\GitHub\hexo執行以下指令
</tr> </tbody> </table> hexo init
安裝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查看效果
</tr> </tbody> </table> 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
</ol>同步內容至GitHub
- 下載GitHub Windows
- 設置Local path如E:\快盤\GitHub\
- 運行Git Shell切換到如E:\快盤\GitHub\hexo路徑下
- 執行hexo g命令生成public文件夾
- 把生成的內容全部拷貝到Local path或其子目錄
- 運行GitHub確認修改信息后執行右上角的Sync同步
- 最后訪問主頁觀察效果
</ol>
域名和DNS
域名推薦
GoDaddy makes registering Domain Names fast, simple, and affordable.
</blockquote>
【推薦理由】兩個字“靠譜”,支持支付寶,附優惠碼鏈接http://www.godaddy.com/
http://www.gdcodecoupon.com/DNS推薦
致力于為您提供最穩定、最安全的域名解析服務
</blockquote>
【推薦理由】依然是兩個字“靠譜”,感謝他們一直以來對于公益的堅持設置CNAME
- 在Github的網站目錄下創建CNAME文件
- 填寫自己的域名如hellodog.com,保存結束
- 登錄DNSPod,先添加域名,然后添加記錄,設置如下
</ol>
主機記錄 記錄類型 線路類型 記錄值 MX優先級 TTL </tr> </tbody><td>@ </td> CNAME 默認 wsgzao.github.io. - 10 </tr>www CNAME 默認 wsgzao.github.io. - 10 </tr> </tbody> </table>
Hexo配置修改
告訴自己為什么要選擇Hexo
</blockquote>知識儲備
1.勤學勤練Markdown
本地+云端備份數據是一種習慣
</blockquote>
- Markdown學習路徑 - http://wsgzao.github.io/post/markdown/
</ul>2.使用性感的文本編輯器
工欲善其事必先利其器
</blockquote>
- Notepad2
- Sublime Text
</ul>http://wsgzao.github.io/post/windows/#文本編輯器
Hexo主題
選擇主題建議遵循KISS原則
</blockquote>
- Hexo Themes - http://hexo.io/themes/
Pacman - http://wsgzao.github.io/post/hexo-pacman/- Jacman - http://wsgzao.github.io/post/hexo-jacman/
</ul>常見問題
1.修改配置文件時注意YAML語法,參數冒號:后一定要留空格
2.中文亂碼請修改文件編碼格式為UTF-8如何遷移至Hexo
http://hexo.io/zh-cn/docs/migration.html
Hexo 2.X 升級 3.0
1.做好相關配置文件和文章的備份
2.做任何修改前不要忘記第一件事備份https://github.com/hexojs/hexo/wiki/Migrating-from-2.x-to-3.0
Hexo 3.0 降級 2.X
http://sandylaw.tk/2015/03/07/hexo3to2/
推薦閱讀
- 如何搭建一個獨立博客——簡明Github Pages與Hexo教程
- Zippera hexo系列教程
- 前端工程精粹 | 張云龍
- Hexo 3.0 靜態博客使用指南
</ul> 來自: http://wsgzao.github.io/post/hexo-guide/本文由用戶 mxw8 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!相關經驗
相關資訊
sesese色