活動頁面的構成
關於區段
區段（下又稱 Section）就像積木一樣，讓您能夠以結構化的方式組織頁面內容，在 Campaign Star 製作美觀的活動頁面變得更輕鬆簡單。
您可以簡單把 Section 想像成頁面的一個個段落。不同 Section（不同段落）可以有不同的主題，例如主題橫幅 Section、相關商品 Section、行動呼籲 (Call-to-action) Section 等等。
如果在 Section 層級設定了 AMP 標籤，Campaign Star 就能在您於這個 Section 底下建立商品列表或分類列表等元件時，自動根據所選標籤抓取對應的商品或分類，為您省下一一設定內容的時間。
👉 詳細介紹請見 Section 基底標籤
關於頁面內容
元件庫選項
在頁面編輯器點擊左側工具列的 [＋] 號後，您可以在元件面板查看 [元件] 與 [區段] 分頁。
- 區段：系統提供的區段模板，或者由您自行設計的區段模板
- 元件：依類型展示不同元件，提供更靈活的設計空間
以下介紹 [元件] 分類的選項內容。
佈局
決定你的元件有幾欄。
基本元素
- 標題 (Heading)
- 文字 (Text)
- 按鈕 (Button)
- 分隔線 (Divider)
- 圖片 (Image)
- 圖片容器 (Image box) - 您可以在這個圖片容器裡面，再拖曳新增其他元件，創造多樣化的圖文佈局。
- 影片 (Video)
主題橫幅
- 主題橫幅 (Topic banner) - 以 Section 為單位的元件，裡面有預設的圖文佈局。
商品
- 商品列表 (Product list) - 可讓消費者具體瀏覽與活動相關的商品，從而提升商品的曝光度並促進銷售成長。
分類
- 分類列表 (Category list) - 可透過讓消費者瀏覽相關分類，提升活動頁面的導流效果，並促進特定分類的曝光度。
進階元素
元件階層和結構
區段（Section）
列（Row）
欄（Column）
- 標題（Heading）、文字（Text）
- 圖片（Image）、圖片容器（Image box）
- 影片（Video）
- 按鈕（Button）
- 分隔線（Divider）
- 自訂語法（Custom code）
分類列表（Category list）
分類欄（Category column）
- 分類圖片（Category image box）
- 分類文字（Category text）
- 分類按鈕（Category button）
商品列表（Product list）
商品欄（Product column）
- 商品內容列（Product content row）
- 商品內容欄 1（Product content column 1）
- 商品圖片（Product image）
- 商品內容欄 2（Product content column 2）
- 商品標題（Product title）
- 品牌（Brand）
- 商品價格（Product price）
- 原價（Price）
- 售價（Sale price）
- 折扣（Discount）
- 商品按鈕（Product button）
商品列表查看更多按鈕（Product list view more button）
Instagram 藝廊（Instagram gallery）
Instagram 貼文（Instagram post）
載入更多按鈕（Load more button）
新增內容的方法
從左側面板選擇要新增的內容，並透過拖放的方式加入到畫布：
- 先決定要插入到頁面的版面佈局（以下為插入雙欄的範例）
- 確定版面佈局後，再將元件拖放到該佈局中即可
- 您隨時都可以叫出左側的圖層樹，確認元件佈局
如果要往空白畫布新增第一個元件，請先將元件拖曳至畫布最上方，出現藍色定位線後，再放開滑鼠。
Updated about 2 months ago