設定顯示條件

橫幅編輯器的 Placement 索引標籤控制兩件事：橫幅列顯示在頁面的哪裡，以及誰會看到它。兩種橫幅類型（基本橫幅和無限捲動橫幅）都使用同一個索引標籤。

開啟 Placement 索引標籤

在 Sami Product Labels 中建立或編輯橫幅時，點擊左側面板頂端的 Placement。

Placement 索引標籤：頂端為位置選擇器，下方為條件面板。

選擇顯示位置

Position 是第一個面板，且為必填，每個橫幅都有一個位置。

位置	行為
Top	位於頁面內容上方，並將內容往下推。
Top Sticky	將內容往下推，並在顧客捲動時保持可見。
Top Overlay	覆蓋在頁面內容的頂端，而不是將內容往下推。
Overlay Sticky	覆蓋在內容上，並在顧客捲動時保持可見。
Bottom Sticky	固定在檢視區的底部。
Custom	預設不會顯示在任何位置，需要您自行使用短代碼放置。請參閱短代碼放置。

條件面板

位置選擇器下方的所有內容都是選用的。面板若留空，就不會設下任何限制：橫幅會顯示給所有人，且在該位置允許的任何地方都會顯示。

商品條件

將橫幅限制在符合某條規則的商品上。點擊 Add conditions，然後由三個部分組成一列：欄位、運算子（is equal to / is not equal to）和值。

欄位	您要選擇的值
Select Products	您商品目錄中的個別商品。
Product tag	一個或多個商品標籤。
Product compare price	原價，用於指定折扣商品。
Collections	一個或多個商品系列。

使用列尾的刪除圖示可移除該列，再次點擊 Add conditions 則可疊加更多列。

注意

Product tag 條件需要 GOLD 或更高階的方案。

符合所有條件或任一條件

當面板中有多列時，Products must match 選項按鈕會決定它們的合併方式：

• all conditions：每一列都必須為真 (AND)。例如，商品帶有 sale 標籤而且屬於 Clearance 商品系列。
• any condition：其中一列即可 (OR)。例如，商品帶有 sale 標籤或屬於 Clearance 商品系列。

在面板中各列的 AND 和 OR 邏輯之間切換。

每個運算子的完整行為，請參閱條件運算子參考資料。

顧客條件

依瀏覽者的身分限制橫幅。點擊 Add conditions，然後選擇欄位：

欄位	選項
Customer	Is Logged In 或 Not Logged In。
Customer tag	符合一個或多個顧客標籤。

注意

顧客標籤條件需要 GOLD 或更高階的方案。

頁面條件

將橫幅限制在特定的頁面類型。每一列由 Page、運算子和頁面類型組成：

頁面類型	適用位置
Index page	您商店的首頁。
Collection page	列出商品系列中商品的頁面。
Product page	個別商品詳細資訊頁面。
Article Page	部落格文章頁面。
Blog page	部落格列表頁面。
Cart page	購物車頁面，包括購物車抽屜。
Search page	搜尋結果。
Specific pages	任何其他頁面，依您輸入的網址比對。

注意

沒有「所有頁面」選項，將 Page conditions 留空，橫幅就會顯示在所有地方。

語言條件

使用開關開啟此面板，選擇 Operator（Equals 或 Not equals），然後搜尋並選取您商店的語言。只有在顧客目前使用的語言相符時，才會顯示橫幅。

注意

依語言指定需要 DIAMOND 方案。在其他方案中，橫幅會顯示給所有語言。

國家／地區條件

使用開關開啟此面板，選擇 Operator（Equals 或 Not equals），然後搜尋並選取國家／地區。適用於特定地區的運送或促銷訊息。

其他條件

包含單一的 Device targeting 設定：All devices、Desktop 或 Mobile。

顯示日期

使用 Start 和 End 日期與時間來排程橫幅，兩者的格式都是 YYYY-MM-DD HH:mm。將欄位留空，即表示該端的時間範圍不設限，例如只設定 End，即可讓橫幅執行到特價結束為止。

短代碼放置

當您需要將橫幅放在佈景主題中的精確位置，而不是固定在頁面頂端或底部時，請選擇 Custom 位置。

1. 複製短代碼

   開啟 Placement 索引標籤底部的 Shortcode 面板，並點擊 Copy。程式碼片段如下：

   <div class="samitaPL-banner" data-id="YOUR_BANNER_ID"></div>

   您也可以從橫幅清單的 Shortcode 欄複製。

2. 貼到您的佈景主題中

   在 Shopify 後台中，前往線上商店 > 佈景主題 > 編輯程式碼，並將程式碼片段貼到 Liquid 範本或自訂 HTML 區段中橫幅應顯示的位置。

注意

只有在需要精確放置時才使用短代碼。其他情況下，單靠五個內建位置之一就已足夠。

有效指定的訣竅

• **先廣後窄。**先選擇位置，確認橫幅有顯示，然後再新增條件。
• **請記住面板之間會合併。**不同面板中的條件必須全部通過：商品條件加上頁面條件，表示兩者都必須符合。
• **檢查兩種裝置。**使用編輯器上方的行動裝置預覽切換開關，若訊息只適用於其中一種裝置，請設定 Device targeting。
• **在您的商店前台測試。**啟用橫幅並載入受影響的頁面，確認它顯示在您預期的位置。

後續步驟

• 建立基本橫幅：建立靜態或輪播的公告列。
• 建立無限捲動橫幅：建立跑馬燈式的橫幅列。
• 橫幅總覽：返回橫幅中心。

提示

需要協助嗎？

如果您在操作這些步驟時遇到任何困難，請透過 [email protected] 聯絡我們。