在產品頁面顯示 Shop Promise
符合資格、預估於美國境內 5 個日曆日內送達的配送，會在配送日期旁以及產品頁面顯示 Shop Promise 徽章。此徽章可讓顧客知道其訂單可享快速且可靠的配送。
在您 啟用 Shop Promise 後，請使用 佈景主題編輯器 前往產品頁面，確認 Shop Promise 徽章是否正確顯示。
若徽章未正確顯示，請確認您的商店已啟用 加速結帳按鈕。您也可以透過多種方式自訂 Shop Promise 徽章的顯示。
手動定位 Shop Promise 模組
如果您熟悉閱讀與編輯佈景主題程式碼，您可以 找出要變更的位置 並 更新產品頁面。
找出要變更的位置
Shop Promise 模組的程式碼必須包含在產品頁面的產品表單中，該表單通常類似於 {%- form 'product', product -%}。依佈景主題不同，Shop Promise 模組可能位於各種位置。以下是常見位置：
main-product.liquidproduct-form.liquidproduct-template.liquidproduct.liquid
更新產品頁面
步驟：
電腦版
在 Shopify 管理介面中，前往線上商店 > 佈景主題。
找到要編輯的佈景主題，點選
圖示以開啟動作選單，然後點選編輯程式碼。開啟相關檔案。
尋找包含
{%- if block.settings.show_dynamic_checkout -%}或{{ form | payment_button }}的那一行。在
{%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%}的正下方另起一行，並在該行貼上以下內容：
<div class="delivery-promise__promise-container"></div>- 點選儲存。
結果應類似如下：
{%- if block.settings.show_dynamic_checkout -%}
{{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>行動裝置
在 Shopify app 中，點選
圖示。在 **銷售管道**區段中，點選 **線上商店** > **管理所有佈景主題**。
找到要編輯的佈景主題，點選… 按鈕以開啟動作選單，然後點選編輯程式碼。
開啟相關檔案。
尋找包含
{%- if block.settings.show_dynamic_checkout -%}或{{ form | payment_button }}的那一行。在
{%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%}的正下方另起一行，並在該行貼上以下內容：
<div class="delivery-promise__promise-container"></div>- 點選儲存或✓。
結果應類似如下：
{%- if block.settings.show_dynamic_checkout -%}
{{ form | payment_button }}
{%- endif -%}
<div class="delivery-promise__promise-container"></div>手動覆寫 Shop Promise 模組的佈景主題
Shop Promise 模組提供深色與淺色兩種佈景主題。系統會自動選用與產品頁面背景色對比度最高的主題。
如果您熟悉閱讀與編輯佈景主題程式碼，您可以在用來 手動定位 Shop Promise 模組 的錨點元素上加入資料屬性，來覆寫模組所選用的佈景主題。
在進行任何變更前，請先 複製佈景主題，並在副本中進行編輯，以便輕鬆還原變更。
步驟：
電腦版
- 依照指示在產品頁面 手動定位 Shop Promise 模組，接著保持佈景主題編輯器開啟狀態。
- 在新建立的錨點元素上加入一個佈景主題資料屬性，將其設為dark 或 light。
- 點選儲存。
結果應類似下列其中一種：
<div class="delivery-promise__promise-container" data-theme="dark"></div>或
<div class="delivery-promise__promise-container" data-theme="light"></div>行動裝置
- 依照指示在產品頁面 手動定位 Shop Promise 模組，接著保持佈景主題編輯器開啟狀態。
- 在新建立的錨點元素上加入一個佈景主題資料屬性，將其設為dark 或 light。
- 點選儲存。
結果應類似下列其中一種：
<div class="delivery-promise__promise-container" data-theme="dark"></div>或
<div class="delivery-promise__promise-container" data-theme="light"></div>為 Promise 模組新增自訂 HTML 或 Liquid
如果您的佈景主題支援自訂區塊，您可以使用「自訂 Liquid」區塊，將 Shop Promise 模組新增至產品頁面，無須編輯佈景主題程式碼。
使用自訂 Liquid 區塊新增 Promise 模組的步驟：
電腦版
在 Shopify 管理介面中，前往線上商店 > 佈景主題。
找到要編輯的佈景主題，然後點選編輯佈景主題。
使用頂端選單列的範本選擇器，前往某個產品頁面。
在側邊欄選單中，找到商品資訊區段。
點選新增區塊，再從可用區塊清單中選取自訂 Liquid。
在自訂 Liquid 文字欄位中，貼上以下程式碼：
<div class="delivery-promise__promise-container"></div>- 拖曳該區塊至想要的位置，通常放在「購買按鈕」區塊下方。
- 點選儲存以套用變更。
若要指定佈景主題偏好（深色或淺色），請改用下列其中一項：
<div class="delivery-promise__promise-container" data-theme="dark"></div>或
<div class="delivery-promise__promise-container" data-theme="light"></div>行動裝置
在 Shopify app 中，點選
圖示。在 **銷售管道**區段中，點選 **線上商店** > **管理所有佈景主題**。
找到使用中的佈景主題，點選編輯佈景主題。
使用頂端的範本選擇器，前往某個產品頁面。
點選 產品資訊 區段。
點選 新增區塊，並選取 自訂 Liquid。
在自訂 Liquid 文字欄位中，貼上以下程式碼：
<div class="delivery-promise__promise-container"></div>- 拖曳該區塊至想要的位置，通常放在「購買按鈕」區塊下方。
- 點選 儲存 以套用變更。
若要指定佈景主題偏好（深色或淺色），請改用下列其中一項：
<div class="delivery-promise__promise-container" data-theme="dark"></div>或
<div class="delivery-promise__promise-container" data-theme="light"></div>Shop Promise 徽章支援的語言
請參閱下表，瞭解 Shop Promise 徽章可顯示的語言。如果您的商店語言未受支援，則 Shop Promise 徽章會以英文顯示。
| 中文 (簡體) | 中文 (繁體) | 克羅埃西亞文 | 捷克文 |
| 丹麥文 | 荷蘭文 | 英文 | 芬蘭文 |
| 法文 | 德文 | 希臘文 | 印地文 |
| 匈牙利文 | 印尼文 | 義大利文 | 日文 |
| 韓文 | 立陶宛文 | 馬來文 | 挪威文 (Bokmål) |
| 波蘭文 | 葡萄牙文 (巴西) | 葡萄牙文 (葡萄牙) | 羅馬尼亞文 |
| 俄文 | 斯洛伐克文 | 斯洛維尼亞文 | 西班牙文 |
| 瑞典文 | 泰文 | 土耳其文 | 越南文 |