建立橫幅
從入門範本建立橫幅,並發佈到您的商店前台。
這是從空白的 Banners 頁面到顧客看得到橫幅的完整流程。
-
開啟 Banners 並開始建立
Section titled “開啟 Banners 並開始建立”在應用程式選單中,點擊 Banners,然後點擊 Create banner。
如果這是您的第一個橫幅,頁面會顯示 Create your first banner,中間有相同的按鈕。

建立第一個橫幅之前的 Banners 頁面。
-
會開啟一個對話方塊,其中有十種入門範本,依用途分組。點擊左側的一個,右側的預覽會顯示橫幅在頁面上的樣子。
群組 入門範本 Sale and urgency Flash sale, Black Friday, Selling fast, Sticky footer Discount code Discount code, Welcome offer Shipping Free shipping, Shipping cutoff Announcement Announcement, New arrivals 預覽下方的小標籤會說明其中包含什麼(Text、Countdown、Button)以及位置。
想從零開始建立嗎?請選擇清單底部的 Start from blank。
點擊 Use this template。

每個入門範本之後都可以修改,沒有任何內容是固定的。
-
建構器會開啟。在左上角,將名稱換成您在清單中容易辨識的名稱,例如「Black Friday top bar」,而不是「Banner 3」。
欄位旁的計數器會顯示還剩多少字數空間。
-
撰寫橫幅要說的內容
Section titled “撰寫橫幅要說的內容”Content 面板會列出橫幅中的元素。點擊其中一個,其設定就會在右側欄中開啟。
- 點擊 Text 來變更訊息
- 點擊 Countdown 來設定結束日期
- 點擊 Button 來變更標籤和連結目的地
- 拖曳每列左側的控點即可重新排序
- Add element 會將新元素加到最後
請參閱橫幅內容與元素,了解各個元素的功能。

在左側選擇元素,在右側進行修改。
-
開啟 Design 面板,也就是側欄中的筆刷圖示。
設定背景、文字和強調色、橫幅所佔的空間,以及顧客是否能關閉它。請參閱設計橫幅。
-
選擇顯示位置
Section titled “選擇顯示位置”開啟 Placement 面板,也就是側欄中的第三個圖示。
- Top of the page 會將頁面往下推;Bottom of the page 則固定在畫面底部
- Stay on screen 讓橫幅在顧客捲動時保持在視野內
- Conditions 決定哪些頁面會顯示,保持 All pages 即會在所有地方顯示
- Devices 限制只在桌機或行動裝置上顯示
- Schedule 讓橫幅自動開啟和關閉
請參閱橫幅顯示位置。
-
建構器的中間會在模擬的商店前台頁面上顯示橫幅。頂端的兩個圖示可在桌機和行動裝置寬度之間切換,值得看一下,因為在筆電上閱讀順暢的橫幅,在手機上可能顯得擁擠。
-
設為 Active 並儲存
Section titled “設為 Active 並儲存”在名稱旁,將 Draft 切換為 Active,然後點擊 Save。
Draft 會儲存橫幅但不會顯示給任何人看。Active 才會讓它出現在商店前台。

橫幅必須是 Active,顧客才看得到。
-
查看您的商店前台
Section titled “查看您的商店前台”在新分頁中開啟您的商店並重新載入。橫幅應該會出現在頁面頂端或底部。
沒有看到嗎?請依照倒數計時未顯示逐項檢查,橫幅適用相同的檢查項目。
如果按鈕需要連結
Section titled “如果按鈕需要連結”設為 Open a link 的按鈕必須有 URL,橫幅才能以 Active 狀態儲存。入門範本已預先填入 /collections/all,請將它改為您希望顧客前往的頁面。