在商品頁面上顯示 Shop Promise
如果商品預計在五個日曆日內於美國境內送出,則該合格商品的配送日期旁邊和商品頁面上會顯示 Shop Promise 徽章。此徽章讓顧客知道他們的訂單包括快速且可靠的配送服務。
Shop Promise 申請獲准後,您應使用佈景主題編輯器導覽至商品頁面,確認 Shop Promise 徽章正確顯示。
如果徽章未正確顯示,則需要手動放置 Shop Promise 模組。
手動放置 Shop Promise 模組
如果您習慣閱讀和編輯佈景主題程式碼,便可自行找出需變更之處並更新商品頁面。
找出需變更之處
Shop Promise 模組的程式碼需包含在產品頁面的商品表單中,應類似於 {%- form 'product', product -%}
。根據不同的佈景主題,Shop Promise 模組的位置也會有所不同。常見位置如下:
-
main-product.liquid
-
product-form.liquid
-
product-template.liquid
-
product.liquid
更新商品頁面
步驟如下:
電腦版
- 在 Shopify 管理介面中,前往「網路商店」>「佈景主題」。
- 找到要編輯的佈景主題,按一下「...」按鈕以開啟動作選單,然後點擊「編輯程式碼」。
- 開啟相關檔案。
- 找出包含
{%- if block.settings.show_dynamic_checkout -%}
或{{ form | payment_button }}
的那一行。 - 直接在
{%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%}
下方建立新的一行,並貼上以下內容:
- 按一下「儲存」。
結果應與下列內容類似:
iPhone
- 在 Shopify 應用程式中,點選「…」按鈕。
- 在「銷售管道」區段中,點選「網路商店」。
- 點一下「管理佈景主題」。
- 找到要編輯的佈景主題,點選「...」按鈕以開啟動作選單,然後點選「編輯程式碼」。
- 開啟相關檔案。
- 找出包含
{%- if block.settings.show_dynamic_checkout -%}
或{{ form | payment_button }}
的那一行。 - 直接在
{%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%}
下方建立新的一行,並貼上以下內容:
- 點選「儲存」。
結果應與下列內容類似:
Android
- 在 Shopify 應用程式中,點選「…」按鈕。
- 在「銷售管道」區段中,點選「網路商店」。
- 點一下「管理佈景主題」。
- 找到要編輯的佈景主題,點選「...」按鈕以開啟動作選單,然後點選「編輯程式碼」。
- 開啟相關檔案。
- 找出包含
{%- if block.settings.show_dynamic_checkout -%}
或{{ form | payment_button }}
的那一行。 - 直接在
{%- if block.settings.show_dynamic_checkout -%}{{ form | payment_button }}{%- endif -%}
下方建立新的一行,並貼上以下內容:
- 點選「儲存」。
結果應與下列內容類似:
手動覆寫 Shop Promise 模組佈景主題
Shop Promise 模組具有深色和淺色的佈景主題。模組會自動使用對比度最高的佈景主題 (與商品頁面的背景顏色相比)。
如果您習慣閱讀和編輯佈景主題程式碼,便可將資料屬性新增至用於手動放置 Shop Promise 模組的錨點元素,來覆寫所選模組的佈景主題。
進行變更前,請複製您的佈景主題並對其進行編輯,以便輕鬆還原任何變更。
步驟如下:
電腦版
- 請按照說明操作,在商品頁面中手動放置 Shop Promise 模組,並讓佈景主題編輯器保持開啟。
- 將佈景主題資料屬性新增至新建立且設為深色或淺色的錨點元素。
- 按一下「儲存」。
結果應與下列其中一個類似:
或
iPhone
- 請按照說明操作,在商品頁面中手動放置 Shop Promise 模組,並讓佈景主題編輯器保持開啟。
- 將佈景主題資料屬性新增至新建立且設為深色或淺色的錨點元素。
- 點選「儲存」。
結果應與下列其中一個類似:
或
Android
- 請按照說明操作,在商品頁面中手動放置 Shop Promise 模組,並讓佈景主題編輯器保持開啟。
- 將佈景主題資料屬性新增至新建立且設為深色或淺色的錨點元素。
- 點選「儲存」。
結果應與下列其中一個類似:
或