使用hexo在github上搭建我的博客

文章目錄

這裏文章都是從我的的github博客直接複製過來的,排版可能有點亂. 原始地址 http://benq.imgit

此教程適合我這種雖然在用github,卻不懂git命令的文盲.github

創建博客源碼倉庫

首先在github上建立一個空的倉庫用來存放博客程序.
npm

安裝github windows客戶端https://windows.github.com/. 注意github客戶端是在線安裝,若是安裝不成功,就使用代理試試.
安裝完成github客戶端後,打開客戶端並登陸,把剛纔建立的項目clone到本地.windows

安裝hexo

1	npm install -g hexo

hexo安裝完成後,打開命令行,進入剛纔的github倉庫目錄的上一級,初始化hexo項目.七牛雲存儲

1	hexo init <目錄名>

進入倉庫目錄,安裝依賴模塊服務器

1	npm install

大局域網安裝起來可能會有點慢,耐心等待..markdown

安裝完成後,運行hexo服務端併發

1	hexo server

打開http://127.0.0.1:4000.

安裝成功hexo

經常使用命令:編輯器

hexo clean //清理
hexo new filename //建立新文章
hexo generate //生成靜態站點(位於public目錄)
hexo deploy //發佈,後面會講

更多hexo命令,能夠查看官方文檔http://hexo.io/docs/

安裝hexo主題

hexo主題有點少. 目前我在用jacman這個主題,這個比較適合國人用,集成了多說評論.

在倉庫目錄裏運行命令

1	git clone https://github.com/wuchong/jacman.git themes/jacman

將主題下載到themes/jacman目錄.
打開倉庫根目錄下的配置文件_config.yml ,修改theme爲 theme: jacman

重啓服務器(hexo server)便可看到新樣式
jacman主題的詳細介紹 http://wuchong.me/jacman/2014/11/20/how-to-use-jacman/

提交倉庫

刪除theme目錄下的landscape目錄,這個主題咱們不用了.
刪除theme/jacman目錄下.git目錄和.gitignore文件.
切換到github for windows客戶端,提交倉庫並同步到線上

創建gh-pages分支

用網頁打開倉庫地址https://github.com/benqy/hello-benqy
點擊Settings

而後

再而後

最後

這樣gh-pages分支就建立完成了.能夠打開http://benqy.github.io/hello-benqy 看看效果

切換到該分支

複製分支的clone URL https://github.com/benqy/hello-benqy.git

繼續打開根目錄的_config.yml,將deploy改成

deploy:
  type: git
  repository: https://github.com/benqy/hello-benqy.git
  branch: gh-pages

在根目錄運行命令

1	npm install hexo-deployer-git --save

接下來運行生成靜態站點併發布的命令

1	hexo deploy --generate

過程當中會須要輸入github賬號密碼
發佈成功:

打開博客地址:http://benqy.github.io/hello-benqy 會發現頁面亂了,由於還沒配置博客路徑
依然是打開配置文件config.yml,根據註釋修改URL配置

1 2	url: http://yoursite.com root: /

改成

1 2	url: http://benqy.github.io/hello-benqy root: /hello-benqy

從新發布

1 2	hexo clean hexo deploy --generate

再次打開博客,一切都正常了

發佈文章

至此,博客的搭建完成了.
之後要發文章,只要在博客目錄運行

1	hexo new 文件名

就會在source/_posts下生成對應的.md文件.
運行本地服務器

1	hexo server

經過markdown格式編寫文章,並打開本地地址127.0.0.1:4000查看實時效果

文章寫完後

1	hexo deploy --generate

提交便可
記得主倉庫也用github for windows提交到github上

配置cname

…

進階:圖片自動上傳

利用七牛免費的存儲和方便的接口來讓咱們的markdown編輯器在粘貼圖片時自動上傳到七牛雲存儲,並返回圖片地址.我博客裏的全部圖片都是這樣上傳的,寫文章時徹底不用停下來傳圖.