針對指令碼更新 Liquid 範本

如果您在線上商店中執行指令碼，則需要檢查這些指令碼對您店面中的頁面造成什麼影響。許多佈景主題中都有包含支援指令碼的程式碼，但有些則未包含。若您的佈景主題不含程式碼，您可以自行加入。

Shopify Plus

Shopify 指令碼和 Script Editor 應用程式僅開放 Shopify Plus 商家使用。無法再從 Shopify App Store 下載 Script Editor 應用程式。

Shopify 指令碼將於 2025 年 8 月 28 日移除，且不再運作。在此日期之前，請將現有指令碼移轉至 Shopify Functions。

疑難排解

大部分的指令碼和佈景主題問題都與提供折扣的商品項目指令碼有關，例如訂單總金額正確，但是商品項目價格沒有顯示折扣。客戶需要瞭解折扣的計算方式，他們希望看到售價和折扣後的價格，以及簡短的折扣說明。如果您的購物車中缺少上述任何詳細資訊，您需要新增 Liquid 程式碼以顯示這些內容。

檢查指令碼對店面影響的一個好方法是以客戶身分造訪，並執行可觸發指定碼的動作。

Liquid 物件屬性

以下清單列出在商店購物車中支援指令碼的常見必要 Liquid 物件屬性：

購物車物件屬性：

• cart.total_discount
• cart.original_total_price

商品項目屬性：

• line_item.discounts
• line_item.message
• line_item.original_price
• line_item.original_line_price
• line_item.total_discount

指令碼物件：

• 指令碼物件可用來傳回商店啟用中指令碼的相關資訊。若要對指令碼進行偵錯，此物件相當有用。

範例

下列範例說明為了支援商品項目指令碼，您可以對 cart.liquid 範本進行的變更。

範例購物車

例如，若購物車中有三件商品項目：

• 足球

  • 數量：1
  • 單價：15.00 美元

• 網球

  • 數量：5
  • 單價：5.00 美元

• 慢跑鞋

  • 數量：1
  • 單價：30.00 美元

且您已發佈套用於以下折扣的指令碼：

• 兩個以上網球折扣 10%
• 所有鞋類折扣 5 美元

那麼您的 cart.liquid 範本可能是一個簡單的表格，列出商品項目和其總金額摘要：

<table class="cart">
  <thead class="heading">
    <tr>
      <th>Product</th>
      <th>Quantity</th>
      <th>Total</th>
    </tr>
  </thead>

  <tbody class="line-items">
    {% for item in cart.items %}
    <tr>
      <td>{{ item.product.title }}</td>
      <td>{{ item.quantity }}</td>
      <td>{{ item.line_price | money }}</td>
    </tr>
    {% endfor %}
  </tbody>

  <tfoot class="summary">
    <tr>
      <td colspan="2">Total</td>
      <td>{{ cart.total_price | money }}</td>
    </tr>
  </tfoot>
</table>

指令碼套用折扣後，這個範本會為您的購物車建立下列表格：

產品	數量	總計
足球	1	15.00 美元
網球	5	22.50 美元
慢跑鞋	1	25.00 美元
總計		62.50 美元

更新商品項目

若要顯示指令碼所套用的折扣，便需要更新商品項目以顯示三個重要資訊：

• 折扣前的商品項目價格
• 折扣後的商品項目價格
• 說明已套用折扣的訊息。

若要這麼做，您可以使用下列 Liquid 物件屬性：

• line_item.total_discount 會傳回已對商品項目套用的折扣金額
• line_item.original_line_price 會傳會折扣前的商品項目價格
• line_item.message 會傳回說明已對商品項目套用折扣的訊息。

使用刪除線有助於區別商品項目的售價與折扣後的商品項目價格：

<tbody class="line-items">
  {% for item in cart.items %}
  <tr>
    <td>{{ item.product.title }}</td>
    <td>{{ item.quantity }}</td>
    <td>
      {{ item.line_price }}
      {% if item.total_discount > 0 %}
        <s>{{ item.original_line_price }}</s>
        ( {{ item.message }} )
      {% endif %}
    </td>
  </tr>
  {% endfor %}
</tbody>

您的購物車現在看起來應該就像：

產品	數量	總計
足球	1	15.00 美元
網球	5	22.50 美元 25.00 美元 (買兩顆以上網球折扣 10%)
慢跑鞋	1	25.00 美元 30.00 美元 (所有鞋類折扣 5 美元)
總計		62.50 美元

更新購物車摘要

為了協助客戶追蹤其訂單金額，也應該顯示以下項目：

• 購物車的原始小計金額，方便客戶比較折扣前後的總金額
• 客戶的購物車省下的總金額。

同樣地，若要新增此資訊，您可以使用下列 Liquid 物件屬性：

• cart.total_discount 會傳回套用至購物車內商品的折扣金額
• cart.original_total_price 會傳回折扣前的購物車小計金額。

使用這些資訊更新後的 .summary 區塊，看起來應該就像：

<tfoot class="summary">
  <tr>
    <td colspan="2">Subtotal</td>
    <td>{{ cart.original_total_price | money }}</td>
  </tr>
  <tr>
    <td colspan="2">Discount Savings</td>
    <td>{{ cart.total_discount | money }}</td>
  </tr>
  <tr>
    <td colspan="2">Total</td>
    <td>{{ cart.total_price | money }}</td>
  </tr>
</tfoot>

您的購物車表格現在看起來應該就像：

產品	數量	總計
足球	1	15.00 美元
網球	5	22.50 美元 25.00 美元 (買兩顆以上網球折扣 10%)
慢跑鞋	1	25.00 美元 30.00 美元 (所有鞋類折扣 5 美元)
小計		70.00 美元
折扣後省下		7.50 美元
總計		62.50 美元

在範本中新增幾個 Liquid 物件，您便能協助客戶瞭解折扣的計算方式。

其他範例

下列 Liquid 範例顯示每個商品項目適用的折扣：

  {% if item.original_line_price != item.line_price %}
  <small class="original-price"><s>{{ item.original_line_price | money }}</s></small>
  {% endif %}
  {{ item.line_price | money }}
  {% for discount in item.discounts %}
  <small class="discount">{{ discount.title }}</small>
  {% endfor %}

請參閱包含 Liquid 程式碼變更的其他折扣範例。