自訂裝箱單

您可以自訂裝箱單的範本。變更範本可加入自家品牌行銷，並調整裝箱單的外觀和風格。

本頁內容

變更商店地址

若要編輯或變更商店地址，請前往設定 > General，在那裡編輯商店資訊。

若只想變更裝箱單上的地址，請依下列步驟操作。

步驟：

在 Shopify 管理介面中，前往設定 > Shipping and delivery。
在文件區段中，點擊出貨單範本。
找出參照商店地址的 Liquid 變數 {{ shop_address.summary }}。若找不到此變數，請改用下列變數：

{{ shop_address.address1 }}, {{ shop_address.city }}, {{ shop_address.province_code }}, {{ shop_address.zip }}, {{ shop_address.country }}

將這段程式碼反白選取並刪除。
在空白處輸入您要顯示在裝箱單上的地址。例如，格式可如下： 123 Example Street, New York, NY, 10000, United States
按一下 預覽範本 以查看變更。
按一下儲存。

移除產品圖片

您可以移除裝箱單上顯示在產品名稱旁的產品圖片。

步驟：

在 Shopify 管理介面中，前往設定 > Shipping and delivery。
在文件區段中，點擊出貨單範本。
找出以下參照產品圖片的 Liquid 變數：

{% if line_item.image != blank %}
       <div class="flex-line-item-img">
         <div class="aspect-ratio aspect-ratio-square" style="width: {{ desired_image_size }}px; height: {{ desired_image_size }}px;">
           {{ line_item.image | img_url: effective_image_dimensions | img_tag: '', 'aspect-ratio__content' }}
         </div>
       </div>
       {% endif %}

將這段程式碼反白選取並刪除。
按一下 預覽範本 預覽變更。
按一下儲存。

編輯標誌

在將商店標誌新增至裝箱單之前，您需要先將標誌上傳至 Shopify 管理介面。上傳後，請記下上傳的檔案名稱，以便稍後在裝箱單範本中使用。

將標誌上傳至商店後，您可以add your logo and remove your store name、add your logo above your store name，或add your logo next to your store name。

步驟：

在 Shopify 管理介面中，前往內容 > Files。
按一下 上傳檔案。
從您的裝置選取並上傳商店標誌。
上傳完成後請記下檔案名稱，包含副檔名 (例如 .png 或 .jpg)。

加入標誌並移除商店名稱

您可以將裝箱單上方的商店名稱移除，改為顯示商店標誌。

步驟：

在 Shopify 管理介面中，前往設定 > Shipping and delivery。
在文件區段中，點擊出貨單範本。
找出以下參照商店名稱的程式碼：

<p class="to-uppercase">
  {{ shop.name }}
</p>

將這段程式碼反白選取並刪除。
在您建立的空間中，使用先前上傳的檔案名稱輸入以下程式碼：

{{ 'FILE NAME' | file_img_url: 'small' | img_tag: 'Logo' }}

file_img_url 篩選條件會為指定尺寸的上傳檔案產生網址，而 img_tag 篩選條件則會使用您提供的替代文字建立 HTML 圖片標籤。

例如，若上傳的檔案為 shop_logo.png，則對應的 Liquid 程式碼將是：

{{ 'shop_logo.png' | file_img_url: 'small' | img_tag: 'Logo' }}

選取 預覽範本 以預覽變更。
按一下儲存。

在商店名稱上方加入標誌

若要在裝箱單頂端將標誌加在商店名稱上方，請依下列步驟操作。

步驟：

在 Shopify 管理介面中，前往設定 > Shipping and delivery。
在文件區段中，點擊出貨單範本。
找出以下參照商店名稱的 Liquid 變數，並在兩行之間加入斷行：

<div class="shop-title">
      |
      <p class="to-uppercase">

在您建立的空間中，使用先前上傳的檔案名稱 (例如 shop_logo.png) 輸入以下程式碼：

{{ 'FILE NAME' | file_img_url: 'small' | img_tag: 'Logo' }}
<br>

選取 預覽範本 以預覽變更。
按一下儲存。

在商店名稱旁加入標誌

若要在裝箱單頂端將標誌加在商店名稱旁，請依下列步驟操作。

步驟：

在 Shopify 管理介面中，前往設定 > Shipping and delivery。
在文件區段中，點擊出貨單範本。
找出以下參照商店名稱的 Liquid 變數：

<p class="to-uppercase">
{{ shop.name }}
</p>

將這段程式碼反白選取並刪除。
在您建立的空間中，使用先前上傳的檔案名稱 (例如 shop_logo.png) 輸入以下程式碼：

{{ 'FILE NAME' | file_img_url: 'small' | img_tag: 'Logo' }}
<span class="to-uppercase">
  {{ shop.name }}
</span>

找出以下 Liquid 變數：

.shop-title {
  -webkit-box-flex: 6;
  -webkit-flex: 6;
  flex: 6;
  font-size: 1.9em;
}

在以上變數的最後新增一行，並貼上以下程式碼：

.shop-title img {
 vertical-align: middle;
}

.shop-title span {
 vertical-align: middle;
}

選取 預覽範本 以預覽變更。
按一下儲存。

使用 CSS 設定裝箱單樣式

您可以使用上傳至 Shopify 的 CSS 檔案來自訂裝箱單。存放在 Shopify 以外的 CSS 檔案將無法正確呈現。

步驟：

在 Shopify 管理介面中，前往內容 > Files。
按一下 上傳檔案。
選取並上傳您的 CSS 檔案。
上傳完成後，複製檔案網址。
加入以下程式碼：

<link
  rel="stylesheet"
  type="text/css"
  href="https://cdn.shopify.com/path_to_file/styles.css"
>