Introduction

SHOP Builder 新增活動商品元件，為了活動商品元件顯示剩餘庫存/活動銷量/商品摘要，對於有開啟 Layout Engine 的店家，需調整代碼支援此功能：

本次整 UI 範例展示如下：

A. 調整語系檔 Locales

調整多語言文案，以下以繁體中文舉例，開發者自行添加或調整 i18n key:

shopline_translations.revenue.remaining
shopline_translations.revenue.remaining.sales_quantity

範例語言如下：

語言	remaining	sales_quantity
zh-hant.json	剩 {{ n }} 份	售出 {{ n }} 份
zh-cn.json	剩 {{ n }} 份	售出 {{ n }} 份
en.json	{{ n }} Left	{{ n }} Sold
ja.json	{{ n }} Left	{{ n }} Sold
vi.json	{{ n }} Left	{{ n }} Sold

B. 調整 templates/quick_cart_product.liquid 商品快速加入購物車代碼文件

更新 templates/quick_cart_product.liquid，補充剩餘庫存/活動銷量/商品摘要代碼

{% if show_stock and product.unlimited_quantity == false and product.quantity > 0 %}
  {% assign show_sales_info = true %}
{% elsif quantity_sold > 0 %}
  {% assign show_sales_info = true %}
{% else %}
  {% assign show_sales_info = false %}
{% endif %}
{% if show_sales_info %}
  <div class="sales-info">
    {% if show_stock and product.unlimited_quantity == false and product.quantity > 0 %}
      <div class="stock">
        {{ 'shopline_translations.themes.revenue.remaining' | translate: n: product.quantity | escape }}
      </div>
    {% endif %}
    {% if quantity_sold > 0 %}
      <div class="sales-quantity">
        {{ 'shopline_translations.themes.revenue.sales_quantity' | translate: n: quantity_sold | escape }}
      </div>
    {% endif %}
  </div>
{% endif %}
{% if show_summary %}
  <div class="summary">{{ product.summary }}</div>
{% endif %}

步驟二：剩餘庫存/活動銷量/商品摘要代碼調整如下圖所示