新增購買按鈕或內嵌商品系列到您的網站

在 Shopify 管理員中新增「購買按鈕」銷售管道後,即可為產品或產品系列建立新的購買按鈕:

購買按鈕範例

建立購買按鈕的方式有以下兩種:

  • 產生程式碼以嵌入網頁的 HTML,此可在該頁面上顯示購買按鈕。您可自訂購買按鈕的外觀,並將其連結至 Shopify 結帳、購物車或產品說明頁面。購買按鈕程式碼可適用單一產品或產品系列。

  • 您可產生結帳連結,以新增至電子郵件行銷活動、私密訊息或社群媒體貼文。

為單一產品建立購買按鈕

您可建立單一產品的購買按鈕,其中只包含一個或所有產品子類選項。建立購買按鈕時,您可選擇範本並自訂按鈕顏色、文字和外觀,以及客戶按一下該按鈕後系統會出現的動作。深入瞭解如何自訂購買按鈕。

步驟:

  1. 按一下「建立購買按鈕」

  2. 從目錄中選擇產品,或使用搜尋功能找到所需產品。按一下「選擇產品」

  3. 如果您的產品有多個子類選項,請選擇「所有子類選項」或從下拉式清單中選擇一個子類選項。

  4. 選擇範本並自訂按鈕顏色、文字和外觀,以及客戶按一下該按鈕後系統出現的動作:

    購買按鈕建立程序

    若要深入瞭解其他自訂購買按鈕的方式,請參閱自訂購買按鈕

  5. 按一下「產生程式碼」

  6. 按一下「將程式碼複製到剪貼簿」,以複製該段程式碼。

  7. 開啟您要顯示購買按鈕的網頁 HTML 編輯器。請參閱新增購買按鈕程式碼到 HTML

  8. 在 HTML 內您想要顯示購買按鈕的位置貼上程式碼,然後儲存變更。

建立內嵌產品系列

您可建立內嵌產品系列,以針對系列中的產品產生購買按鈕。

內嵌產品系列可讓系列中的每項產品都有各自的購買按鈕,以便客戶從中選擇任何產品。建立內嵌產品系列時,您可自訂精選產品的購買按鈕顏色、文字和外觀,以及客戶按一下該按鈕後系統會出現的動作。產品系列中的每項產品按鈕都會套用相同的自訂設定。深入瞭解如何自訂購買按鈕。

步驟:

  1. 按一下「建立購買按鈕」

  2. 按一下「產品系列」

  3. 選擇產品系列,然後按一下「選擇產品系列」

  4. 自訂按鈕顏色、文字和外觀,以及客戶按一下該按鈕後系統會出現的動作:

    若要深入瞭解其他自訂購買按鈕的方式,請參閱自訂購買按鈕。

  5. 按一下「產生程式碼」

  6. 按一下「將程式碼複製到剪貼簿」,以複製該段程式碼。

  7. 開啟您要顯示內嵌產品系列的網頁 HTML 編輯器。請參閱新增購買按鈕程式碼到 HTML

  8. 在 HTML 內您想要顯示內嵌產品系列的位置貼上程式碼,然後儲存變更。

自訂購買按鈕

您可自訂購買按鈕顏色、大小和外觀,並選擇客戶按一下該按鈕後系統會出現的動作。為單一產品建立購買按鈕時,您也可選擇購買按鈕的範本。從「建立」頁面產生程式碼之前,您可先預覽選擇的範本。

購買按鈕範本

為單一產品建立購買按鈕時,您也可從下列範本中選擇:

附產品圖片的按鈕圖示 基本範本 選擇此範本可在購買按鈕旁顯示產品圖片和價格。
只有圓形按鈕的圖示 按鈕範本 選擇此範本可新增無任何產品圖片的購買按鈕。若您已在線上其他地方展示產品圖片,而只想新增結帳連結,則可採用此選項。
左邊為產品圖片和文字、右邊為按鈕的圖示 進階範本 選擇此範本可在購買按鈕旁顯示產品圖片、價格及說明。

購買按鈕的動作

建立購買按鈕時,您可從「點擊時的按鈕動作」清單中選擇一個動作。只要使用者按一下頁面上的購買按鈕,便會發生以下任一種情況:

  • 將產品放入購物車:此可將產品新增至購物車,且客戶可繼續購物並新增其他產品至購物車。
  • 將買家導向結帳頁面:此可將客戶直接導向結帳頁面以購買產品,但客戶無法將其他產品新增至訂單。
  • 顯示產品詳細資料:此可隨「加入購物車」按鈕顯示產品說明。若產品有多張圖片,也會一併顯示。

購買按鈕的大小和對齊方式

您可從「大小」「對齊」下拉式選單中選擇購買按鈕部分的大小及對齊方式。您可預覽購買按鈕,以決定最適合顯示在網頁上的選項。

購買按鈕的外觀

  • 按鈕樣式和文字:此提供購買按鈕的按鈕部分樣式及顏色選項。
  • 字型樣式:此提供購買按鈕文字及其產品資訊的字型和顏色選項。
  • 購物車:此提供內嵌購物車的文字和顏色選項。

建立結帳連結

您可以在安裝「購買按鈕」銷售管道後,為您的產品建立結帳連結。客戶可以按一下結帳連結,將單一產品子類選項加入結帳。您可以在電子郵件訊息、社交媒體貼文或私人訊息中分享結帳連結。

您可以從「產品詳細資訊」頁面建立結帳連結。

步驟:

  1. 前往「產品」,然後按一下您要分享的產品,以查看其詳細資訊。

  2. 在產品詳細資訊頁面上,按一下「更多動作」下拉式選單。

  3. 按一下「建立結帳連結」

  4. 如果您的產品有多個子類選項,則請選擇一個子類選項。每個結帳連結都只會對應到一個產品子類選項。

  5. 按一下「複製連結」以複製連結。

  6. 直接在訊息、電子郵件或社群媒體貼文中貼上連結。

須知:若要讓結帳金額套用折扣,您可在連結結尾處加上 &discount=CODE。例如,假設您的折扣代碼標題為 15off,則可在連結結尾處加上 &discount=15off。客戶使用該連結結帳時即可享有折扣優惠。

分享結帳連結

建立結帳連結後,您需要與客戶分享連結,以便他們使用。您可以複製連結文字並將其貼到電子郵件行銷活動、社交媒體貼文或直接訊息中。例如,您可以將連結貼到 Twitter 推文中,以方便您的關注者購買促銷產品,或者您可以將連結以簡訊發送給詢問您如何購買產品的客戶。

準備好開始透過 Shopify 銷售商品了嗎?

免費試用