自訂 Order Printer 範本
在 Shopify 管理介面,您可以為 Order Printer 應用程式建立及自訂最多 15 個範本。根據預設,Order Printer 應用程式內含 2 個範本:
- 發票- 可用於傳送給客戶的基本發票
- 裝箱單- 載明您的商店地址及客戶運送地址的列印單據
建立新的 Order Printer 範本
若要建立新的 Order Printer 範本,您必須熟悉 HTML、CSS 及 Liquid。Shopify 佈景主題支援服務,可協助您於符合「Shopify 設計政策」的範圍內進行小幅調整。
步驟:
在 Shopify 管理介面中,點擊「設定」>「應用程式和銷售管道」。
按一下「Order Printer」,開啟應用程式。
點擊「管理範本」。
點擊「新增範本」。
在「名稱」欄位中,為新的範本輸入一個名稱。
在「程式碼“欄位中,新增HTML、CSS或液体程式碼,以建立您的範本。
完成後,請按一下「儲存」。
編輯 Order Printer 範本
若要編輯您的 Order Printer 範本,您必須熟悉 HTML、CSS 及 Liquid。Shopify 佈景主題支援服務,可協助您於符合「Shopify 設計政策」的範圍內進行小幅調整。
步驟:
在 Shopify 管理介面中,點擊「設定」>「應用程式和銷售管道」。
按一下「Order Printer」,開啟應用程式。
點擊「管理範本」。
點擊您要編輯的範本名稱。
在「程式碼」欄位中新增或編輯 HTML、CSS 或 Liquid,即可對您的範本進行變更。若要檢視範本自訂內容的範例,請參閱「範例範本自訂內容」。
完成後,請按一下「儲存」。
範例範本自訂內容
下列範例展示了自訂 Order Printer 範本的常見方法:
範例:將商標新增至 Order Printer 範本
您可以將商標新增至訂單發票、裝箱單及自訂範本:
- 在 Shopify 管理介面 中,依序前往「內容」>「檔案」。
- 在Shopify 應用程式中,前往「商店」>「設定」。
- 在「商店設定」底下,點一下「檔案」。
- 在Shopify 應用程式中,前往「商店」>「設定」。
- 在「商店設定」底下,點一下「檔案」。
按一下「上傳檔案」,然後在您的電腦中選擇圖片檔案。
在「檔案」頁面中,點擊圖片的網址將其反白,然後進行複製。
在 Shopify 管理介面中,點擊「設定」>「應用程式和銷售管道」。
按一下「Order Printer」,開啟應用程式。
點擊「管理範本」。
點擊您要編輯的範本名稱。
在您想要顯示商標的範本位置中,輸入下列程式碼片段:
。
使用您所複製的圖片 URL 網址來取代「
your-image-URL
」。視您要顯示商標的位置而定,您可能需要新增一個
標籤,在圖片的前方或後方加入換行符號。
在 HTML 中應顯示為:
範例:將表格寬度設為 100%
若要使您的表格具有邊框,且寬度為 100%,請新增「table-tabular
」類別至您的表格:
class="table-tabular">...
範例:顯示商品縮圖
若要顯示商品縮圖,請在您的範本中插入此程式碼:
新增訂單詳細資訊
您可以在範本中加入訂單詳細資訊,例如:所購買之商品的名稱、數量及金額。若要將訂單詳細資訊新增至您的範本:
在 Shopify 管理介面中,點擊「設定」>「應用程式和銷售管道」。
按一下「Order Printer」,開啟應用程式。
點擊「管理範本」。
點擊您要編輯的範本名稱。
使用 Liquid 變數新增訂單詳細資訊及 HTML 來新增格式。例如,
{{ line_item.price | money }}
會列印商品價格。完成後,請按一下「儲存」。
舉例而言,Nyla 想要編輯裝箱單範本,以包含要運送的商品清單。她在 Order Printer 應用程式中,將下列程式碼新增至其「Packing slip
」(裝箱單) 範本的最下方:
Quantity Item {% if show_line_item_taxes %} Taxes {% endif %} Price {% for line_item in line_items %} {{ line_item.quantity }} x {{ line_item.title }} {% if line_item.tax_lines %} {% for tax_line in line_item.tax_lines %} {{ tax_line.price | money }} {{ tax_line.title }}
{% endfor %} {% endif %} {{ line_item.price | money }} {% endfor %}
現在,Nyla 的裝箱單現在包含一張列出已購買商品的表格。