利用Octopress在Github上搭建博客及後續問題總彙

 首先貼一下個人新博客地址： http://findingsea.github.io

用Octopress在GitHub上搭建博客已經不是什麼新鮮事了，網上的教程也多了去了，大題的方法什麼都差很少，這篇Blog就把這些資源總彙一下，而後再加幾點我遇到的問題和解決辦法。

搭建和配置

搭建的大體過程大概包括：安裝Ruby --> 安裝Octopress --> 配置Octopress --> 部署到GitHub上 --> 提交博客。我主要參考的是破船的這篇教程——《利用Octopress搭建一個Github博客》。一路按教程走下來大問題應該不會有，可是小問題可能就不斷了，這待會會講到。

其餘比較推薦的教程還有，唐巧的這篇《象寫程序同樣寫博客：搭建基於github的博客》(好吧，他還把『像』寫錯了)。這裏面還提到了一些提升訪問速度的技巧和介紹了一個支持微博評論的工具，都挺有用的。

另外，還有這篇《Octopress - 像黑客同樣寫博客》，介紹地很是詳細，並介紹了不少個性化配置的技巧，其中對CSS的修改我以爲很是值得學習和借鑑。

//--- 2013-09-21 update ---//

以及這篇《Octopress博客問題解決方案與技巧》，裏面彙總了不少Octopress的設置技巧，在首頁輸出摘要的設置方法和zsh報錯的緣由（下面會提到），我都是從這篇文章裏面找到。

遇到的問題

安裝失敗問題

在運行下面這些語句的時候，終端直接就沒反應了，而後過好久報error，聽說是訪問的地址可能被牆了，可是我在瀏覽器裏訪問http://rubygems.org/這個地址是能夠的，因此就很糾結，當時就卡在這裏下不去，最後無奈就多試了幾回，結果就行了。你只能服了天朝的網絡了。（從目前狀況來看，應該識沒有被牆，若是報相似could not download這種錯誤，只能多試幾回，也沒別的辦法了）

gem install bundler
rbenv rehash    # If you use rbenv, rehash to be able to run the bundle command
bundle install

引號問題

根據唐巧的教程，新建文章的指令應該是：

rake new_post["title"]

而後在相應的markdown文件中頭部自動生成的信息中會有：

title: "title"

當時當我按照這個指令去執行的執行的時候，終端報錯：

zsh: no matches found: new_post[title]

我在網上找到的解決辦法是將指令改爲：

rake 'new_post["title"]'

這樣建立新文章是成功了，可是立馬引起了另外一個問題。生成好文章以後，執行rake generate指令，終端報錯：

/Users/findingsea/.rvm/rubies/ruby-1.9.3-p448/lib/ruby/1.9.1/psych.rb:203:in `parse': (<unknown>): did not find expected key while parsing a block mapping at line 2 column 1 (Psych::SyntaxError)
    from /Users/findingsea/.rvm/rubies/ruby-1.9.3-p448/lib/ruby/1.9.1/psych.rb:203:in `parse_stream'
    from /Users/findingsea/.rvm/rubies/ruby-1.9.3-p448/lib/ruby/1.9.1/psych.rb:151:in `parse'
    from /Users/findingsea/.rvm/rubies/ruby-1.9.3-p448/lib/ruby/1.9.1/psych.rb:127:in `load'
    from /Users/findingsea/.rvm/gems/ruby-1.9.3-p448/gems/jekyll-0.11.2/lib/jekyll/convertible.rb:33:in `read_yaml'
    from /Users/findingsea/.rvm/gems/ruby-1.9.3-p448/gems/jekyll-0.11.2/lib/jekyll/post.rb:39:in `initialize'
    from /Users/findingsea/Workspace/Github/octopress/plugins/preview_unpublished.rb:23:in `new'
    from /Users/findingsea/Workspace/Github/octopress/plugins/preview_unpublished.rb:23:in `block in read_posts'
    from /Users/findingsea/Workspace/Github/octopress/plugins/preview_unpublished.rb:21:in `each'
    from /Users/findingsea/Workspace/Github/octopress/plugins/preview_unpublished.rb:21:in `read_posts'
    from /Users/findingsea/.rvm/gems/ruby-1.9.3-p448/gems/jekyll-0.11.2/lib/jekyll/site.rb:128:in `read_directories'
    from /Users/findingsea/.rvm/gems/ruby-1.9.3-p448/gems/jekyll-0.11.2/lib/jekyll/site.rb:98:in `read'
    from /Users/findingsea/.rvm/gems/ruby-1.9.3-p448/gems/jekyll-0.11.2/lib/jekyll/site.rb:38:in `process'
    from /Users/findingsea/.rvm/gems/ruby-1.9.3-p448/gems/jekyll-0.11.2/bin/jekyll:250:in `<top (required)>'
    from /Users/findingsea/.rvm/gems/ruby-1.9.3-p448/bin/jekyll:23:in `load'
    from /Users/findingsea/.rvm/gems/ruby-1.9.3-p448/bin/jekyll:23:in `<main>'

當時差點沒嚇死，覺得怎麼了，把關鍵錯誤描述上網搜了下，找到了這篇《Linked List Posts: From Movable Type to Octopress》這個老兄（暫且認爲是男的吧）和我遇到了同樣的錯誤，他新建的markdown文件裏title的內容裏，出現雙引號嵌套雙引號，這違反了markdown的語法規則，因此解析出錯了。我立馬查看了我新建的問題，果真如此：

title: ""title""

着就至關於中間的title不包含在任何引號中，因此生成的時候會報錯。最後我把指令改爲以下所示，就一切正常了。

rake 'new_post[title]'

至於緣由如今還不是很清楚，我懷疑頗有多是shell形成的，我用的zsh，而教程上通常用bash的比較多。

//--- 2013-09-21 update ---//

上面提到的問題已在《Octopress博客問題解決方案與技巧》中找打，的確是shell引發的問題，用zsh的同窗能夠借鑑下。

字體問題

因爲對字體方面有潔癖，因此在這上面耗費了好久，看了不少博客採用的字體方案，其中Aiur最讓我喜歡，尤爲是正文的英文字體，因此我立馬留言向博主詢問他採用的是哪一種字體，最後得知是Google的開源字體Open Sans。

Octopress字體的設置文件是：sass/custom/_fonts.scss，其中$heading-font-family定義的是文章標題的字體，$header-title-font-family定義的是博客標題的字體，$header-subtitle-font-family定義的是博客子標題的字體，$sans和$serif定義的是正文的字體，$mono定義的是代碼的字體。這裏須要注意的是，/sass/custom/_style.scss裏定義的樣式會覆蓋其餘地方定義的樣式，但惟獨_font.scss裏的這幾個值不會被覆蓋，也就說若是你在_fonts.scss裏已經定義了$mono的值，還想在_style.scss中修改<code></code>的字體樣式是不行的，最後渲染出的結果仍是$mono的字體。（一開始我不知道這一點，在_style.scss裏折騰了很久）。

特別說明的是我對編程字體尤爲在乎，我最喜歡的是Adobe的開源字體Source Code Pro，並且是跨平臺的，不過這在不少機器上不必定有裝，並且貌似GoogleFonts沒有收錄這個字體，因此我依次補充了Mac上最適宜的編程字體Monaco，Windows上最適宜的編程字體Consolas，和Ubuntu上最適宜的編程字體Ubuntu Mono，這裏的設置是依次序尋找到第一個可使用的字體。（也就說瀏覽器會先尋找本機是否裝有Source Code Pro，若是沒有就尋找下一個Monaco，以此類推，直到找到一個可用的字體進行渲染，另外，我所選的三款字體都是三個平臺默認安裝的，這樣能夠最大程度地保證代碼閱讀質量）

下面是個人_fonts.scss文件中的定義：

$sans: Open Sans;
$serif: Open Sans;
$mono: Soure Code Pro, Monaco, Consolas, Ubuntu Mono;
$heading-font-family: "PT Serif",Georgia,"STHeiti","SimHei","Helvetica Neue",Arial,sans-serif;
$header-title-font-family: "Futura", sans-serif;
$header-subtitle-font-family: "Futura", sans-serif;

最後說一點，在上文中提到的唐巧的《象寫程序同樣寫博客：搭建基於github的博客》中，他提到了一個優化博客load速度的方法是：刪除/source/_includes/custom/head.html文件中的谷歌字體，由於GFW的關係，這部分載入會特別慢。但這會引起一個問題就是你沒法使用PT Serif和Open Sans這些優質的谷歌字體了，解決方法是能夠講他們下載到本地，而後在/sass/custom/_style.scss中添加：

css @font-face { font-family: Open Sans; src: url(fonts/OpenSans-Regular.ttf) } 不過這種方法的弊端在於須要把你用到的每一個本地可能沒有安裝的字體都下載下來，我嫌太麻煩，就沒有按這種方法，並且英文字體庫不像中文字體庫動輒上M，基本都維持在K這個級別，速度慢了這麼一點仍是能夠忍受的。