關於Jekyll

Jekyll 是一個簡單的部落格形態的靜態站點生產機器。它有一個模版目錄，其中包含原始文字格式的文件，通過 Markdown （或者 Textile） 以及 Liquid 轉化成一個完整的可釋出的靜態網站，你可以釋出在任何你喜愛的伺服器上。Jekyll 也可以執行在 GitHub Page 上，也就是說，你可以使用 GitHub 的服務來搭建你的專案頁面、部落格或者網站，而且是完全免費的。

書寫部落格是一個很好地習慣，所以就整理建立一個部落格系統來記錄自己的所見所聞所得！

另外，個人感覺另一款部落格框架hexo也挺好的，實際上這兩款部落格框架都是目前較為主流的。

寫在前面(網上搜集來的)

• 針對Windows系統下的使用者，使用 Jekyll 搭建部落格之前要確認下本機環境，Git 環境（用於部署到遠端）、Ruby 環境（Jekyll 是基於 Ruby 開發的）、包管理器 RubyGems

  (由於我是基於windows來做這個的，所以有必要配置安裝相關的Windows環境，方便以後操作。)

  Jekyll是一個免費的簡單靜態網頁生成工具，可以配合第三方服務例如： 評論、分享等等擴充套件功能(評論第三方服務的選擇後面會講到)，Jekyll 可以直接部署在 Github（國外） 或 Coding（國內） 上，可以繫結自己的域名。Jekyll中文文件、Jekyll英文文件、Jekyll主題列表

  。

• 如果你是 Mac 使用者，你就需要安裝 Xcode 和 Command-Line Tools了。

ruby與ruby gem的關係

• ruby是一種指令碼語言
• ruby的其中一個“程式”叫rubygems，簡稱 gem(ruby 1.9.2及其以上就已經預設安裝了ruby gem的，所以無需再次手動安裝)
• 另外還有一個ruby bunder(rails框架中用來管理專案的gem的，叫bundle)，在windows中搭建jekyll，需要安裝完ruby後用gem 安裝下bunder。

ruby與jekyll的關係

• jekyll是基於ruby的，所以搭建jekyll之前必須確保ruby正常安裝 注意，必須ruby大於2.0.0。

jekyll與python的關係(表示才知道)

• jekyll3.0之前，有一個語法高亮外掛”Pygments”，這玩意是基於python的，所以才會有各種教程裡面都說搭建jekyll之前需要python環境。
  !!!但是,請注意 jekyll3.0以後，語法高亮外掛已經預設改成了 “rouge‘ 而它是基於ruby的，也就是說 現在搭建jekyll,我們完全不必要再安裝python 這樣可以減少很大一部分工作量。

為什麼ruby要改用source來源

• 不管是那一篇教程，都會告訴你安裝完ruby後需要通過gem命令將官方源改成淘寶源或[ruby china][]源，這是因為預設的官方源在國外，國內幾乎是無法訪問的(具體原因麼…)
  所以才會必須改成其否源，否則無法使用，但是，請注意 現在淘寶源已經停止維護了，最新搭建jekyll 都應該要改成 [ruby china][]的源http://gems.ruby-china.org

如何解決jekyll安裝過程中的問題

• 首先，在確保ruby(2.0.0以上)正常安裝，並且切換了ruby china源(或者淘寶源)後，其它遇到的所有問題幾乎都能解決。
• 當然，確實某些ruby程式的問題，所以只需要根據提示 通過相應命令，比如 gem install … 即可解決.

注：windows下還得確保DEVELOPMENT KIT正常安裝，並且正確配置。

提前總結一下，安裝Jekyll主要有以下三個步驟

• 安裝 Ruby
• 安裝 DevKit
• 安裝 Jekyll

接下來就正式開始安裝啦！

安裝Ruby

根據自己的機型選擇對應的安裝包(因後續有需要安裝不同的gem，我發現好多因為ruby版本問題裝不了，所以在這推薦使用2,2,4版本的)

安裝的注意點：
自動幫你配置環境變數，要安裝在根目錄

測試是否安裝完成：

ruby -v

我的輸出結果是

ruby 2.3.0p0 (2015-12-25 revision 53290) [x64-mingw32]

安裝Devkit

1）執行安裝包並解壓縮至某資料夾，如 C:\DevKit

2）通過初始化來建立config.yml檔案。在命令列視窗內，輸入下列命令：

cd “C:\DevKit”
ruby dk.rb init
notepad config.yml

3）在開啟的記事本視窗中，於末尾新增新的一行- C:\Ruby200-x64(這段代表加上自己的ruby路徑，實際中可以將C:\Ruby200-x64改為自己的實際ruby目錄)，儲存檔案並退出。

4）回到命令列視窗內，審查（非必須）並安裝。

ruby dk.rb review
ruby dk.rb install

一切順利後，就代表Development Kit已經正確安裝並配置

更改預設的source源

這是很重要的一步！鑑於官方源無法訪問，所以我們得更換為可以使用的源，這裡推薦使用[ruby china][]源，大致步驟如下:

• 先鍵入命令gem sources -l檢視當前已經新增的源(預設應該是同時有官方源和淘寶源);
• 然後通過gem sources -r https://rubygems.org/ gem sources -r https://ruby.taobao.org/分別移除官方源和淘寶源 (注意，請對比實際，移除自己已經新增的源即可，可以改為自己上一步中查詢出來的地址);
• 通過gem sources -a http://gems.ruby-china.org添加了[ruby china][]的可用源;
• 修改來源後可以通過gem sources -l檢視是否正確修改。

注意,上述的[ruby china][]源,我採用了http連結，這是因為我在windows中使用https時遇到了ssl問題，並且無法解決，如果你能正確解決，可以換為https連結。

安裝jekyll

先檢視你的gem是否安裝完畢：

gem -v
gem install jekyll

測試是否安裝完畢：

新建jekyll 專案

jekyll new myblog
cd myblog

執行jekyll 專案： 官方文件

jekyll s / jekyll serve

另外，如果過程中遇到一些其它缺失元件的情況，可以通過相應的gem命令安裝

最終成功執行！

簡析目錄結構

　
Jekyll 的核心其實是一個文字轉換引擎。它的概念其實就是： 你用你最喜歡的標記語言來寫文章，可以是 Markdown，也可以是 Textile,或者就是簡單的 HTML, 然後 Jekyll 就會幫你套入一個或一系列的佈局中。在整個過程中你可以設定URL路徑, 你的文字在佈局中的顯示樣式等等。這些都可以通過純文字編輯來實現，最終生成的靜態頁面就是你的成品了。

一個基本的 Jekyll 網站的目錄結構一般是像這樣的：

.
├── _config.yml
├── _includes
|   ├── footer.html
|   └── header.html
├── _layouts
|   ├── default.html
|   ├── post.html
|   └── page.html
├── _posts
|   └── 2018-01-11-welcome-to-jekyll.md
├── _sass
|   ├── _base.scss
|   ├── _layout.scss
|   └── _syntax-highlighting.scss
├── about.md
├── css
|   └── main.scss
├── feed.xml
└── index.html

注意：如果你暫時沒有自己的域名，CNAME裡面就什麼都不用填。

這些目錄結構以及具體的作用可以參考 官網文件

進入 _config.yml裡面，修改成你想看到的資訊，重新 jekyll server ，重新整理瀏覽器就可以看到你剛剛修改的資訊了。

到此，基於Jekyll初步搭建部落格算是完成了。

關於網站評論管理系統與訪問統計系統

訪問統計

你需要去百度統計和Google Analytics(翻個牆咯~ 多大點事)註冊賬號，並提取相應的id（詳細操作請Baidu或Google）這在後面會使用到。

評論管理系統

目前本網站使用的是一款韓國名為“來必力”評論系統，來必力官網。當然還了解了一下這款快速、簡潔且高效的無後端評論系統——Valine評論系統;

後面我又發現了gitment，一款由國內大牛imsun開發的基於github issues的評論系統，網上也是有不少相關的佈置教程的，作者在這裡提供一篇僅供參考–在Jekyll部落格新增評論系統：gitment篇。

下面是這段時間在解決 * 新增評論系統 * 問題時,花時間找了一下國內外的幾個第三方評論系統:

• 多說，曾經較火的評論系統，網上介紹文章比較多，但已於2017年6月1日正式關停服務，無法再用了。

• 暢言，sohu旗下的，網上說：需要個人部落格備案後才能使用，備案操作本身就很繁瑣(這個我沒有測試過，不肯確定)。

• 友言，jiaThis旗下的，網上說：由於時http請求，github pages現在都是https了， 在https站點無法呼叫http請求，故也無法使用(這個我也沒有測試過，不肯確定)。

• 網易雲跟貼，曾被當作“多說”的替代品，可惜官方通報說也在2017年8月1日下線了。

• 再看看Disqus，國外比較火的評論系統，但在國內牆了，也只能暫時放棄了。

• 幸好碰到了來必力,通過這段時間使用情況看，還是挺好的。

關於編寫文章

所有的文章都是 _posts 目錄下面，文章格式為 mardown 格式，文章檔名可以是 .mardown 或者 .md。

編寫一篇新文章很簡單，你可以直接從 _posts/ 目錄下複製一份出來 2018-01-13-Hello World.md ，修改名字為 2018-01-11-article1.md ，注意：文章名的格式必須為 年-月-日-articleName ，後面的 articleName同時也是該篇文章的連結 URL。

只不過如果文章名為中文，比如文章https://javef.github.io/2018/04/走進Markdown園子/的連結URL複製貼上過來就會變成這樣的：https://javef.github.io/2018/04/%E8%B5%B0%E8%BF%9BMarkdown%E5%9B%AD%E5%AD%90/。

所以建議文章名最好是英文或者阿拉伯數字。

開啟你新建的部落格文章2018-01-11-article1.markdown

---
layout: post
title:  "article1"
date:   2018-01-11
tag: jekyll
---

(這兒便是正文內容了...)

其中：

title:  顯示的文章名， 如：title: 我的第一篇文章                    
date:   顯示的文章釋出日期，如：date: 2018-01-11(格式要對)                          
tag:    tag標籤的分類，如：tag: 隨筆            

注意：文章頭部格式必須包含上面的那些樣板資訊，這樣才能正確解析。

我寫文章使用的是Cmd Markdown 編輯閱讀器，如果你對 Markdown 語法不熟悉或者想要了解更多，也可以看看我的另一篇部落格: 走進Markdown園子。

總結

• 雖然說在windows上搭建jekyll時遇到了各種各樣問題，但是最終都解決了；

• 在解決的那一瞬間，其實是挺有滿足感的(大概這也是樂此不疲的原因之一吧)，而且確實感覺知識面比起以前還是有所拓展的；

• 所以不管怎麼樣，還是得多學多動手嘗試！

• 你現在所學的知識，一定會在將來的某個時間段派上用場！

update 2018/4/22

進一步瞭解

• 我們前面講的都是基於ruby+git配置安裝jekyll(Hexo也一樣)，實際上是利用了Jekyll的部落格框架的優勢！

• 通過本地開啟Jekyll服務實現本地隨時隨地除錯，方便；

• 再將自己除錯好的個人部落格專案上傳到遠端程式碼託管倉庫，如GitHub、Coding等，利用他們提供的Pages功能實現靜態網頁的部署；

真正快速部署個人部落格！

先提前說明一下這種取巧的方法，需要下載安裝哪些

具體步驟

1. 建立一個 github 賬號，然後建立一個跟你賬戶名一樣的倉庫，如我的 github 賬戶名叫 Javef，我的 github 倉庫名就叫 javef.github.io；

2. 其實這個時候去瀏覽器輸入https://javef.github.io,這個靜態頁面就已經建立好了，只是這個時候頁面內容太空虛…

3. 那麼為了建立一個好看又穩定、簡潔又完整的網頁，去Google或Baidu搜尋挑選下載某個你認為與你審美搭得上的Jekyll、Hexo等等框架開放原始碼專案，至於修改其中哪些配置引數變成你自己可用的頁面框架，這裡就不贅述了，很簡單的。這裡我提供一些:Jekyll-powered blogs and sites；

4. 下載安裝Git；

5. 下載安裝GitHub Desktop，輸入你的GitHub賬號密碼登入；

6. 通過以下方法將你之前挑選準備的網頁框架專案檔案上傳到遠端託管倉庫。

   • 開啟此電腦，選擇一個資料夾，比如 f 盤的 test 檔案，右鍵空白處點選 git bash here；
   • cd javef.github.io
   • 將自己之前準備的網頁框架專案檔案複製貼上至 f 盤的 test 檔案中
   • git add . # 將新新增的檔案加入索引中
   • git commit -m “first commit” # 將這次的修改作為一個打包
   • git push origin master # 提交到遠端倉庫
   • 可能會有彈出框讓你輸入你的 github 賬號和密碼哦

補充-常用git命令：

$ git clone  //本地如果無遠端程式碼，先做這步，不然就忽略
$ cd //定位到你blog的目錄下
$ git status //檢視本地自己修改了多少檔案
$ git add . //新增遠端不存在的git檔案
$ git commit  -m "what I want told to someone" //提交修改
$ git push  //更新到遠端伺服器上
$ git rm //移除檔案

注意:

• git status 列出當前目錄所有還沒有被git管理的檔案和被git管理且被修改但還未提交(git commit)的檔案，也就是所有改動檔案，紅色字型標出。

• 然後輸入 git add . (有個點) 表示添加當前目錄下的所有檔案和子目錄，

• 然後再輸入一次 git status 如果看見檔案都變綠了 ，那麼就代表 它們已經準備好了被提交（git commit）。

關於 git rm

在github上只能刪除倉庫,卻無法刪除資料夾或檔案, 所以只能通過命令來解決

• $ git rm file1.txt #刪除file1.txt
• git commit -m ‘delete file1.txt’ #提交,新增操作說明
• git push -u origin master #將本次更改更新到github專案上去

這個命令必須是在提交到版本庫中以後才能夠執行的,否則的話：

• 如果這個檔案沒有提交到暫存區，它是不會被發現的：

$ git rm file1.txt
fatal: pathspec 'file1.txt' did not match any files

• 如果提交到暫存區了以後，還是沒辦法刪除：

$ git rm file1.txt
error: the following file has changes staged in the index:
    file1.txt
(use --cached to keep the file, or -f to force removal)

• 如果這個檔案與版本庫中不一致，就刪除不了，除非強制刪除，如下所示：

$ git rm file2.txt
error: the following file has staged content different from both the file and the HEAD:
    file2.txt
(use -f to force removal)

如果你只有一個檔案想要刪除，使用這個命令可以真正的從檔案系統中刪除了檔案，並且它會暫存這個檔案已經被刪除的事實，如果你提交了，這個檔案不會從之前的歷史中消失，但會從未來的提交中消失。

引數–cached

如果你想刪除這樣一個檔案，不想從檔案系統中真正的刪除它,也就是本地專案中的檔案不受操作影響,刪除的只是遠端倉庫中的檔案，就是用下面的命令：

$ git rm --cached file3.txt

換個說法，你想告訴Git，不再跟蹤這個檔案，但是把它保留在工作樹中，這可能是一種情況，你以外地提交了一個檔案，你並不想讓他成為歷史的一部分。它暫存了刪除，但是，他在那裡儲存了檔案，現在，在你的工作樹中，作為一個不被追蹤的檔案。

注意：每次增加檔案或刪除檔案，都要commit 然後直接 git push -u origin master，就可以同步到github上了。

參考資料

【附：一文一圖】