公告欄元件｜Shopper App

您可以按照您希望顯示的活動新增公告欄元件，目前僅支援設定 3 個公告欄元件，也支援設定元件的背景與文字顏色、顯示的內容及跳轉的頁面。

⚠️ 開始前請注意：此功能於香港地區僅支援 Shopper App Pro 版本。

 

本篇文章將分別介紹：

• 設定公告欄元件
• 設定公告欄內容

 

一、設定公告欄元件 

步驟一

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

 

步驟二

點擊「新增元件」，選擇「公告欄元件」。

 

步驟二

點選左側元件庫的「公告欄」。

 

步驟三

在右側編輯區完成以下設定。

1. 展示方式

• 水平切換
  
• 上下切換
  
• 閃爍切換
  

2. 間隔時間

可選擇間隔 1 至 5 秒鐘。

 

3. 顏色設定

設定文字顏色和背景顏色。

 

4. 預約上架時間（選填）

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

 

二、設定公告欄內容

步驟一

於左側區塊新增公告欄，最多新增 3 個公告欄；您也可以在此處開啟／關閉／刪除公告欄元件。

 

步驟二

點選公告欄，於右側編輯區塊選擇公告欄樣式，並分別完成以下設定。

1. 公告欄樣式

• 文字內容
  
   
• 活動倒數
  
   

 

2. 公告欄內容

輸入公告欄的文字內容。

 

若您的公告欄樣式選擇活動倒數，您還需要設定活動時間，或客製化活動開始前後的顯示內容。

 

3. 跳轉連結

設定連結共有「指定分類」、「優惠活動」、「自訂 URL」三種選擇。

• 商品分類

勾選「商品分類」者，點擊「⊕ 選擇商品分類」後，在彈跳視窗裡選擇活動，最後點擊「確認」。更多關於商品列表元件設定細節與注意事項，請參考此篇文章。

• 優惠活動

勾選「活動優惠」者，點擊「⊕ 選擇優惠活動」後，在彈跳視窗裡選擇活動，最後點擊「確認」。 更多關於優惠活動元件設定細節與注意事項，請參考此篇文章。

 

• 自訂 URL

勾選「自訂 URL」者，請於欄位內輸入連結。注意輸入之連結必須以「https://」或「http://」開頭。

 

步驟三

完成所有元件的編輯後，點擊右上方的「儲存」；確認可發佈後，點擊「更新並使用」。

 

 

 

 

延伸閱讀

• 商品列表元件｜Shopper App
• 優惠活動元件｜Shopper App