jekyll使用sass(scss)

目錄結構

.
|-_sass
    |-default.sass
|-css
    |-main.sass

• 將.sass(.scss)放於_sass資料夾中。
• 將主css放於css資料夾中。

在main.sass中加入：

---
---
@import "default"

• 需要加---是因為此檔案是要可以被jekyll所解析的，所以要符合jekyll格式。
• @import的路徑只要是檔案名就可以了。

在.html中引用的路徑是css/main.css

• jekyll會將.sass解析為.css所以後面寫.css即可。

PS:

想要變更_sass資料夾位置或名稱，在_config.yml中加入：

sass:

    sass_dir: 路徑

想要將css壓縮，在_config.yml中加入：

sass:

    style: :compressed

參考

https://github.com/jekyll/jekyll-sass-converter/tree/master/example

http://jekyllrb.com/docs/assets/#sassscss

將footer element固定於網頁最下方

這篇是看完CSS-TRICKS的Sticky Footer（要看程式碼請參考此連結）之後所理解出來的原理解釋。

步驟

1. 將網頁分為兩個部份：

1. 網頁主體（page-wrap）
2. 頁腳區塊（site-footer）

2. 因為是對於margin所作的效果，所以先將其設為0。

3. 將html及body的height設為100％是為了要將網頁設成視窗大小（如果小於視窗大小的話）。

4. 將網頁主體min-height設為100％以符合html大小，而將margin-bottom設為你要的大小的負數，這裡將邊界往內凹，讓頁腳區塊也可以在100％的高度中，但這樣會產生一個問題，當你的網頁長度（height）超過視窗-頁腳區塊的大小時，網頁主體的內容會跟頁腳區塊重疊，為解決這問題，我們需要設置:after。

5. 將網頁主體設定一個:after的區塊，這個after區塊要跟footer一樣大，after區塊會緊跟在page-wrap的內容之後（在page-wrap中），當然他也算在page-wrap的長度裡，這樣子我們就會給page-wrap一個跟site-footer一樣大小的block，也就是利用這個沒有內容（透明）的block去填補原本凹進去的地方，這樣子page-wrap的內容就不會跟site-footer重疊了。

裝設vim-airline font

在安裝vim-airline時有遇到幾個問題，在這裡做個整理。

1. 在terminal中沒有跑出顏色

解決：

在~/.vimrc中寫入下面的程式碼
if $COLORTERM == 'gnome-terminal'
set t_Co=256
endif

參考：

http://askubuntu.com/a/126

2. 安裝之後沒有出現airline

解決：

在~/.vimrc中寫入下面的程式碼
set laststatus=2

參考：

https://github.com/bling/vim-airline#configuration

3.在安裝之後無法完整顯示

解決：

照著https://powerline.readthedocs.org/en/master/installation/linux.html#fonts-installation所給的指示做。

注意：

A. ~/.fonts如果沒有此目錄的話，自己新增（mkdir ~/.fonts）
B. ~/.config/fontconfig/conf.d/如果沒有此目錄的話，新增（mkdir -p ~/.config/fontconfig/conf.d/）

Jekyll問題排除

這裡列出幾個在使用Jekyll的時候所遇到的問題，供日後參考。

問題一：在gem install jekyll時遇到ERROR: Failed to build gem native extension.

解決：安裝ruby 1.9.1（sudo apt-get install ruby1.9.1-dev）

參考：
http://hire.chrisjlee.net/node/229
http://jekyllrb.com/docs/troubleshooting/#installation-problems

問題二：在gem install jekyll時遇到ERROR: While executing gem ... (NoMethodError) undefined method `name' for #<RDoc::RubyToken::TkLPAREN:...>

解決：安裝rdoc（gem install rdoc）

參考：
https://github.com/jekyll/jekyll/issues/1560

問題三：在執行jekyll時遇到Could not find a JavaScript runtime.

解決：安裝nodejs（sudo apt-get install nodejs）

參考：
http://jekyllrb.com/docs/troubleshooting/#could-not-find-a-javascript-runtime-execjsruntimeunavailable
http://stackoverflow.com/a/9333316