一、jekyll介紹

jekyll是一款Blog生成器，不需要數(shù)據(jù)庫的支持。jekyll用于發(fā)行生成靜態(tài)網(wǎng)頁發(fā)行。

1.文件結(jié)構(gòu)

_config.yml：用于保存配置。（jekyll會自動加載這些配置）

_includes文件夾：存放可以重復(fù)利用的文件，可以被其他的文件包含（方法：{% include 文件名 %}）

_layouts文件夾：存放模板文件（標(biāo)簽{{ content }}將content插入頁面中）。

_posts文件夾：存放實際的博客文章內(nèi)容（文件名格式：年-月-日-標(biāo)題.md）。

_site文件夾：存放最終生成的文件（其他的目錄都會被拷貝到最終文件的目錄下。所以css,images等目錄都可以放在根目錄下）。

YAML頭信息（可選的）：（文章只要包含YAML頭，yekyll就會將其轉(zhuǎn)換成html文件）設(shè)置一些預(yù)定義的變量，或你自己定義的變量。

預(yù)定義的變量

也可定義自己的變量：比如title，在文中使用的方法：{{ page.title }}

2.常用命令（命令行輸入）

$ jekyll build???? ：當(dāng)前文件夾中的內(nèi)容將會生成到 ./site 文件夾中。

$ jekyll build --destination <destination>?? ：當(dāng)前文件夾中的內(nèi)容會生成到指定文件夾中。

$ jekyll build --source <source>--destination <destination>? ：將指定源文件夾中的內(nèi)容生成到指定文件夾中。

$ jekyll build --watch? ：查看更改，再生成。

$ jekyll serve? ? ? ：啟動服務(wù)器，使用本地預(yù)覽，運(yùn)行在http://localhost:4000/。（jekyll集成了一個服務(wù)器）

$ jekyll serve --watch???? ：先查看變更在啟動服務(wù)器。

可以在_config.yml文件中添加配置，jekyll會自動獲取其中的配置，例如：

source:_source

destination:_deploy

等同于命令：jekyll build --source _source --destination _deploy

3.jekyll原理

jekyll使用Liquid語言

Liquid語言使用2種標(biāo)記（Output和Tag）：Output：{{content}}，Tag：{% content %}

Liquid過濾器：將左邊字符串通過過濾器得到想要的結(jié)果并輸出。

過濾器示例

Liquid的標(biāo)準(zhǔn)過濾器：

date - 格式化日期

capitalize - 將輸入語句的首字母大寫

downcase - 將輸入字符串轉(zhuǎn)為小寫

upcase - 將輸入字符串轉(zhuǎn)為大寫

first - 得到傳遞數(shù)組的第一個元素

last - 得到傳遞數(shù)組的最后一個元素

join - 將數(shù)組中的元素連成一串，中間通過某些字符分隔

sort - 對數(shù)組元素進(jìn)行排序

map - 從一個給定屬性中映射/收集一個數(shù)組

size - 返回一個數(shù)組或字符串的大小

escape - 對一串字符串進(jìn)行編碼

escape_once - 返回一個轉(zhuǎn)義的html版本，而不影響現(xiàn)有的轉(zhuǎn)義文本

strip_html - 去除一串字符串中的所有html標(biāo)簽

strip_newlines - 從字符串中去除所有換行符(\n)

newline_to_br - 將所有的換行符(\n)換成 html 的換行標(biāo)記

replace - 匹配每一處指定字符串并替換，如 {{ 'foofoo' | replace:'foo','bar' }} #=> 'barbar'

replace_first - 匹配第一處指定的字符串并替換，如 {{ 'barbar' | replace_first:'bar','foo' }} #=> 'foobar'

remove - 刪除每一處匹配字符串，如 {{ 'foobarfoobar' | remove:'foo' }} #=> 'barbar'

remove_first - 刪除第一處匹配的字符串，如 {{ 'barbar' | remove_first:'bar' }} #=> 'bar'

truncate - 將一串字符串截斷為x個字符

truncatewords - 將一串字符串截斷為x個單詞

prepend - 在一串字符串前面加上指定字符串，如 {{ 'bar' | prepend:'foo' }} #=> 'foobar'

append - 在一串字符串后面加上指定字符串，如 {{ 'foo' | append:'bar' }} #=> 'foobar'

minus - 減，如 {{ 4 | minus:2 }} #=> 2

plus - 加，如 {{ '1' | plus:'1' }} #=> '11', {{ 1 | plus:1 }} #=> 2

times - 乘，如 {{ 5 | times:4 }} #=> 20

divided_by - 除，如 {{ 10 | divided_by:2 }} #=> 5

split - 將一串字符串根據(jù)匹配模式分割成數(shù)組，如 {{ "a~b" | split:~ }} #=> \['a','b'\]

modulo - 余數(shù)，如 {{ 3 | modulo:2 }} #=> 1

tag標(biāo)簽：

assign- 創(chuàng)建一個變量

capture- 塊標(biāo)記，把一些文本捕捉到一個變量中（如：把一系列字符串連接為一個字符串，并將其存儲到變量中）

case- 塊標(biāo)記，標(biāo)準(zhǔn)的 case 語句

comment- 塊標(biāo)記，將一塊文本作為注釋

if- 標(biāo)準(zhǔn)的 if/else 塊

unless- if 語句的簡版

include- 包含其他的模板

raw- 暫時性的禁用的標(biāo)簽的解析（展示一些可能產(chǎn)生沖突的內(nèi)容）

cycle- 用于循環(huán)輪換值，如顏色或 DOM 類

for- 用于循環(huán) For loop（for 。。。 in 。。。? limit:int使你可以限制接受的循環(huán)項個數(shù)；offset:int可以可以讓你從循環(huán)集合的第 n 項開始；reversed讓你可以翻轉(zhuǎn)循環(huán)）

jekyll新增的過濾器：

date_to_string - 日期轉(zhuǎn)化為短格式

date_to_long_string - 日期轉(zhuǎn)化為長格式

number_of_words - 統(tǒng)計字?jǐn)?shù)（{{ page.content | number_of_words }}）

array_to_sentence_string - 數(shù)組轉(zhuǎn)換為句子（列舉標(biāo)簽時：{{ page.tags | array_to_sentence_string }}）

markdownify - 將makedown格式字符串轉(zhuǎn)換成HTML

jsonify - data to JSON

jekyll新增標(biāo)簽：

highlight 語言 linenos（行號，可選）- 塊標(biāo)簽，代碼高亮

post_url - 使用某篇博文的超鏈接（不需要寫文件后綴）

gist - github gist顯示代碼（gist的介紹和使用 ）（{% gist 5555251 %}）

4.書寫博客

引用圖片或其他資源：新建一個文件夾存放，在博文中的引用方式：{{site.url}}表示站點的根目錄

其他的資源引用也是一樣的。

5.創(chuàng)建博文目錄

一個簡單的例子，使用的是Liquid模板語言。

創(chuàng)建目錄

6、分頁

在_config.yml里邊加一行，并填寫每頁需要幾行：

paginate:5

對需要帶有分頁頁面的配置： paginate_path:"blog/page:num"

blog/index.html將會讀取這個設(shè)置，把他傳給每個分頁頁面，然后從第2頁開始輸出到blog/page:num，:num是頁碼。如果有 12 篇文章并且做如下配置paginate: 5， Jekyll會將前 5 篇文章寫入blog/index.html，把接下來的 5 篇文章寫入blog/page2/index.html，最后 2 篇寫入blog/page3/index.html。

分頁教程

7、草稿

草稿是你還在創(chuàng)作中不想發(fā)表的文章。

創(chuàng)建一個名為_drafts的文件夾

8、部署到github

http://jekyll.bootcss.com/docs/github-pages/

克隆倉庫到本地：

git? clone? https://github.com/用戶名/用戶名.github.com.git

在本地啟動服務(wù)：

cd? 用戶名.github.com

jekyll? serve? -B

提交代碼到線上：

git? add? --all???????? #添加到暫存區(qū)

git? commit? -m "提交jekyll默認(rèn)頁面"??????? #提交到本地倉庫

git? push? origin? master???????? #線上的站點是部署在master下面的