一篇文章瞭解Liquid Template Engine 模版引擎 (Jekyll模版)

學習製做Jekyll模版，其實主要是學習Liquid語法。

參考：Liquid官方文檔。

就像PHP、ASP、Python等一切網絡動態語言同樣，Liquid也至關於一種獨立的動態語言，沒什麼大差異，基本功能都有。
說白了就是動態生成HTML，能夠輸出變量，操做數組，調用外部數據，設置IF ELSE判斷，FOR循環等，這些都能達到。

開始講語法前，大概說明一下運行流程：

經常使用變量及屬性

參考：Jekyll 語法簡單筆記

site對象

site對象是全站都能調用的變量，所有都在_config.yml文件中定義。
經常使用變量以下：

• site.pages: 全部`_
• site.posts: 全部文章
• site.categories: 全部的 categories
• site.tags: 全部的 tags
• site.related_posts: 從LSI Keywords提取出來最相關最新的10篇文章
• site.collections: 全部集合（與posts邏輯很大不一樣，通常用來放members等特殊數據）
• site.documents: 全部 collections 裏面的文檔
• site.data: _data 目錄下的數據
• site.[abc]: 自定義的變量（手動在_config.yml中指定）

page對象

• page.content: 頁面的內容
• page.title: 標題 （手動在Front Matters中指定）
• page.excerpt: 摘要
• page.url: 連接
• page.date: 時間
• page.id: 惟一標示
• page.categories: 分類（手動在Front Matters中指定）
• page.tags: 標籤（手動在Front Matters中指定）
• page.path: 源代碼位置
• page.next: 下一篇文章
• page.previous: 上一篇文章

categories對象

從site.categories列表中循環獲得的是一個一個的category，其中包括這些屬性：

• cat[0]: 返回cat的名稱
• cat[0].size: 返回這個分類裏的文章數量
• cat[1]: 返回一個post_list列表，包含這個category裏全部的post對象。
• cat[1].size: 返回這個post_list列表中的對象數量。

tag對象

從site.tags列表中循環獲得的是一個一個的tag，其中包括這些屬性：

• tag[0]: 返回tag的名稱
• tag[0].size: 返回這個tags裏的文章數量
• tag[1]: 返回一個post_list列表，包含這個tags裏全部的post對象。
• tag[1].size: 返回這個post_list列表中的對象數量。

paginator對象

• paginator.per_page: 每一頁的數量
• paginator.posts: 這一頁的數量
• paginator.total_posts: 全部文章的數量
• paginator.total_pages: 總的頁數
• paginator.page: 當前頁數
• paginator.previous_page: 上一頁的頁數
• paginator.previous_page_path: 上一頁的路徑
• paginator.next_page: 下一頁的頁數
• paginator.next_page_path: 下一頁的路徑

列表讀取（各類歸檔頁面用）

循環讀取Posts

讀取全站全部的posts：

{% for post in site.posts %}
    <h2> {{ post.title }} </h2>
    <h2> {{ post.url }} </h2>
    <h2> {{ post.category }} </h2> 
    <h2> {{ post.excerpt }} </h2>  ︎ 文章摘要，自動生成的
{% endfor %}

只讀取_posts/文件夾中某個category中的posts，
例如_posts/tech文件夾中放的是一些category爲tech的文章，那麼讀取方式是：

{% for post in site.categories.tech %}
    <h2> {{ post.title }} </h2>
{% endfor %}

注意，在_posts中nested文件夾裏的文章，也必須在Front matter中指定分類，要否則讀不出來。

循環讀取categories

讀取全站全部的分類：

{% for cat in site.categories %}
    <h2> {{ cat[0] }} </h2>
{% endfor %}

讀取全部分類下的全部文章：

{% for cat in site.categories %}
    {% for post in cat[1] %}
        <h2> {{ post.title }} </h2>
    {% endfor %}
{% endfor %}

讀取某個分類下全部的文章：

{% for post in site.categories.blog %}
    <h2> {{ post.title }} </h2>
{% endfor %}

循環讀取tags

讀取全站全部的tags：

{% for tag in site.tags %}
    <h1> {{ tag[0] }} </h1>
{% endfor %}

讀取全部tags下的全部文章：

{% for tag in site.tags %}
    {% for post in cat[1] %}
        <h2> {{ post.title }} </h2>
    {% endfor %}
{% endfor %}

讀取某個tag下全部的文章：

{% for post in site.tags.math %}
    <h2> {{ post.title }} </h2>
{% endfor %}

讀取某category下全部文章並按tag分組讀取

{% for post in site.categories.Tech %}   ︎ 先讀取某分類下全部的文章
     {% assign tags = tags |concat: post.tags |uniq %}   ︎ 把每篇文章的tags存到列表裏，並刪除重複項
{% endfor %}

{% for tag in tags %}
    <h2> {{ tag }} </h2>   ︎ 循環輸出這個category中的全部tags
    {% for post in site.categories.calculus %}
        {% if post.tags contains tag %}      ︎ 循環判斷若是文章屬於此tag則顯示出來
            <h4> {{ post.title }} </h4>
        {% endif %}
    {% endfor %}
{% endfor %}

Post讀取

須要在MD文檔裏指定layout才能調用。好比文檔裏指定了layout: post，那麼系統就找到_layouts/post.html這個文件；若是文檔指定了layout: blog，那麼系統就會找到_layout/blog.html這個文件。
在layout裏面讀取post數據很簡單，不須要for循環，不須要if判斷，直接用post這個對象就行。由於系統已經把文章的數據傳過來了。

假如咱們在_posts/xx.md文章的頭信息中，定義了這些數據：

---
layout: post
title: I'm a post
category: 'blog'
tags: ['jekyll', 'wordpress', 'blog']
---

(注：tags列表等，在yaml中能夠用- tag或['tag']表示，同樣的 )

如下就是這個post.html文件讀取post數據的方式：

<h2> {{ post.title }} </h2>
<h2> {{ post.category }} </h2>

<h2> {{ post.content }} </h2>

{% for tag in post.tags %}
    <h2> {{ tag }} </h2>
{% endfor %}

group_by 分組和where_exp條件篩選

官方的group_by作到了複雜查詢的功能，好比查找某個category下的所有文章並按tag分組顯示。
相對本身寫for/if實現來講，雖然官方提供了這個功能，可是你仔細閱讀文檔就會發現，這個group_by必須配合單獨的靜態的額外的文檔才能實現。
也就是說，你必須手動寫個mygroup.doc文件，一個一個指定每篇文章的分組、分類、順序等。
那實在太麻煩了。

參考官方：Navigation