優惠代碼元件|Shopper App

4. EC + SC.png
12. 品牌會員購物 App (1).png

將商店正在進行中的優惠活動展示在 App 上,顧客可以透過此元件領取優惠券。

⚠️ 開始前請注意:

  • 此功能於香港地區僅支援 Shopper App Pro 版本。
  • 舊版優惠代碼元件已不支援新增,但若您先前已設定並上線於 App 端,仍可正常顯示與運作。

 

本篇文章將分別介紹:

 

一、設定優惠代碼元件

步驟一

前往 SHOPLINE 後台 >「Shopper App 管理 > App 設計 > 目前版型」,點選「設定」進入 App 頁面編輯器。

Screenshot 2025-08-20 at 3.04.37 PM.png

 

步驟二

點擊「新增元件」,選擇「優惠代碼」元件,拖曳至中間預覽區提示可以放置元件的地方。

Screenshot 2025-08-25 at 4.35.11 PM.png
Screenshot 2025-08-27 at 3.15.21 PM copy.png

 

步驟三

於右側編輯區進行以下設定。

1. 標題

輸入精選商品標題,建議輸入優惠代碼的活動折扣類型,最多 100 個字元。

Screenshot 2025-08-28 at 10.56.25 AM.png

 

2. 預約上架時間

若您有設定上架日期,元件將在指定時間於 App 中顯示。

Screenshot 2024-10-24 at 12.06.30 PM.png

 

二、設定優惠活動

步驟一

於左側區塊新增活動,最多新增 5 個活動;您也可以在此處開啟/關閉/刪除優惠代碼元件。

Screenshot 2025-08-28 at 10.58.31 AM.png

 

步驟二

點選要設定的活動,於右側編輯區塊點選「選擇優惠活動」,勾選完成後點選「確定」。

*注意:

  • 請先前往 SHOPLINE 後台 >「促銷及分潤」建立優惠活動,支援的優惠活動包括:滿額滿件優惠、免運優惠、任選優惠、回饋活動。
  • 目前支援促銷方法為「自動套用優惠」或「使用優惠券」的活動;若您設定的優惠券領取方式為「顯示在領券中心」或「透過連結或顧客分群發送」,當顧客尚未領取該優惠券,也可透過此元件領取。
Screenshot 2025-08-28 at 10.59.51 AM.png
Screenshot 2025-08-28 at 11.01.51 AM.png

 

步驟三

完成設定後,可先點擊「儲存」更新元件。若已完成 App 首頁的所有編輯,可點擊「更新並使用」發佈至 App。

Screenshot 2025-08-29 at 1.03.30 AM.png

 

三、App 端顯示效果

  • 當活動數量 > 1 時,支援左右滑動查看更多活動。
  • 針對折扣、贈品與免運三種優惠類型,系統將顯示不同圖示;免運活動樣式設計為橘色,其他活動樣式設計為紅色。
  • 領取型優惠券將顯示「領取」按鈕,當顧客領取成功後,將更新為「去看看」按鈕。
GIF-vertical (2).gif

 

 

 

 

 

還有其他問題?提交請求

評論