Liquid 簡介
Liquid 是由 Shopify 創建並以 Ruby 撰寫的模板語言。它現在作為一個開源專案在 GitHub 上提供，並被許多軟體公司用於各種開發。Liquid 是所有 Shopify 主題的基礎，用於將動態內容載入網路商店的頁面。
本文內容
什麼是模板語言？
設計師和網站開發者可以使用模板語言來建立結合多頁面共用的靜態內容與隨頁面切換而變化的動態內容的網頁。模板語言允許重複使用定義網頁版面配置的靜態元素，同時頁面會動態填充來自 Shopify 商店的資料。靜態元素以HTML撰寫，動態元素則以Liquid撰寫。檔案中的 Liquid 元素充當佔位符：當檔案中的程式碼被編譯並傳送到瀏覽器時，Liquid 會用來自 Shopify 商店的資料取代它們。
Liquid 語法
像傳統的程式語言一樣，Liquid 有語法，能與變數互動，並包含輸出和邏輯等結構。Liquid 結構易於識別，並且與 HTML 不同，使用兩組分隔符：雙大括號分隔符 {{}}，表示輸出，以及帶有百分比大括號的分隔符 {% %}，它們表示邏輯和控制流程。
Liquid 代碼中有三個主要群組：
物件
Liquid 物件從 Shopify 伺服器獲取資料。在主題模板中，物件放在雙大括號中 {{ }} 並且看起來像這樣：
{{product.title}}
在上述範例中，product 是物件，title 是該物件的屬性。每個物件都有一組相關屬性。想了解更多產品物件的屬性，請訪問 product 物件。
Liquid 物件 {{product.title}} 可在 Shopify 主題的 「商品」 模板中找到。當檔案代碼編譯並顯示在 Shopify 商店的商品頁面時，Liquid 物件會顯示在頁面標題中。例如，在服裝商店中，結果可能是：
精美的 T 恤
儘管 Shopify 商店中的每個產品都使用相同的模板，但模板中的 Liquid 物件會根據正在查看的產品頁面顯示不同的資料。
想了解更多可用於主題模板的各種 Liquid 物件，請訪問 Liquid 物件。
Liquid 標籤
Liquid 標籤用於在模板中建立邏輯關係和控制流程。百分比大括號 {% %}，以及它們所包圍的文字，在網頁顯示時不會產生可見效果，但允許指定變數並建立條件或迴圈。
例如，您可以使用 Liquid 標籤根據商品是否有貨，在商品頁面顯示不同的內容：
{% if product.available %}
價格：99.99 美元
{% else %}
抱歉，該產品已售出。
{% endif %}
如果產品可用，將顯示以下內容：
價格：99.99 美元
如果產品不可用，將顯示：
抱歉，該產品已售出。
上面的例子中使用了 if 和 else Liquid 標籤，這些是控制流程標籤。
Liquid 標籤分為四種類型：
過濾器
Liquid 過濾器用於修改數字、字串、物件和變數的輸出。它們放置在標籤中 {{ }} 或 {% %} и обозначаются символом «|».
一個簡單的範例是過濾器 capitalize：
{{ 'привет мир!' | capitalize }}
過濾器會將字串轉為大寫。將顯示：
您好，世界！
一個標籤中可以使用多個過濾器，且它們會從左到右依序套用：
{{ 'Привет мир!' | capitalize | remove: "мир" }}
字串首先會以大寫字母顯示，然後「世界」這個詞會被刪除。將顯示以下內容：
您好！
您可以使用 Liquid 過濾器來執行各種資料操作。過濾器分為 8 種：
- 陣列過濾器
- 顏色過濾器
- HTML 過濾器
- 數學過濾器
- 貨幣篩選器
- 字串篩選器
- URL 篩選器
- 更多篩選條件
主題範本
您可以從 Shopify 後台的 「主題」 區段存取您的主題檔案：
桌面
iPhone
Android
- 從您的 Shopify 後台前往線上商店 > 主題。
- 找到您想修改的主題，然後點擊操作 > 編輯程式碼。
- 點擊您想修改的 Liquid 檔案名稱並進行編輯。
- 點擊儲存。
- 請檢查您的網路商店相關頁面以確認結果。
- 在 Shopify 應用程式中點擊商店。
- 點擊線上商店旁的 … 按鈕，然後點擊管理銷售通路。
- 點擊主題。
- 找到您想修改的主題，然後點擊操作 > 編輯程式碼。
- 點擊您想修改的 Liquid 檔案名稱並進行編輯。
- 點擊儲存。
- 請檢查您的網路商店相關頁面以確認結果。
- 在 Shopify 應用程式中點擊商店。
- 點擊線上商店旁的 … 按鈕，然後點擊管理銷售通路。
- 點擊主題。
- 找到您想修改的主題，然後點擊操作 > 編輯程式碼。
- 點擊您想修改的 Liquid 檔案名稱並進行編輯。
- 點擊儲存。
- 請檢查您的網路商店相關頁面以確認結果。
其他資源
除了在說明中心提供的 Liquid 詳盡參考資料外，您還可以使用 Shopify Cheat Sheet 作為您專案中 Liquid 的快速指南。
要觀看此主題及其他主題的影片，請造訪 Shopify 開發者的 Youtube 頻道。