【品牌官網】如何編輯佈景主題(Candy 或之前發佈之主題)
此文章將講解 Candy 或之前發佈之主題,如果你想要了解 Aroma 或其後發佈之主題,請參考此文章: 【品牌官網】如何編輯佈景主題(Aroma 與其後發佈之主題)
EasyStore 目前可以分為兩類型佈景主題:新版和舊版。新版和舊版佈景主題的設定介面上會有不同,分別為 Aroma 或其後發佈之主題 和 Candy 或之前發佈之主題,簡稱新版主題、舊版主題。
新版主題
舊版主題
你可以參考下圖有關幾個最受歡迎的舊版主題之功能差異:
設定佈景主題
步驟一:選擇與安裝佈景主題
- EasyStore 後台 → 銷售管道 → 品牌官網 → 佈景主題 → 更多主題 → 即可看到全部的佈景主題套版
- 選擇佈景主題後 → 點擊「立即安裝」
步驟二:進入佈景主題設定介面
- 點擊「佈景主題設定」
(每個佈景主題的設定介面欄位都會有些差異,這是因為不是每個佈景主題都會有其功能,後文說明和步驟會以 Candy 佈景主題為例子)
- 主要設定欄位都會在左側目錄欄
- 可切換不同螢幕的預覽,分別是:電腦瀏覽器、平板電腦、手機
步驟三:設定佈景主題
- 一般設定 (General)
(1)設定標題和主要字體、大小、顏色
(2)選擇是否需要上傳官網背景圖、背景顏色和是否使用原始畫質圖片
- 網站 Logo
(1)若你沒有上傳 Logo 圖片,就會以商店名稱作為你的網站 Logo,你可調整其字體和顏色
(2)若你需要上傳 Logo 圖片,你可勾選「客製化 Logo」→ 上傳圖片 → 調整 Logo 寬度
(3)上傳網站圖示,這將會顯示在瀏覽器分頁上
- 主選單 (Top Bar)
(1)設定主選單是否固定在頂部、文字字體、Logo 和導行列位置、字體顏色
- 按鈕(Button)
(1)設定按鈕文字字體、按鈕文字和背景顏色
(2)選擇「滾動到上方按鈕」的位置,客戶點擊後即可回到官網首部
(3)設定結帳按鈕的背景和文字顏色,結帳按鈕將會顯示在購物車裡
(4)選擇商品頁面的規格呈現方式
若勾選「規格標籤選項」
若無勾選「規格標籤選項」
- 連結(Link)
設定官網裡,關於連結的顏色
- 邊框(Border)
設定官網邊框的顏色,例如註冊頁面的邊框
- 佈局(Layout)
(1)官網首頁將會根據你的佈局進行排版(💡 小提醒:由於舊版佈景主題的第一區塊會預設為輪播圖片,且不可更換,所以這裡第 1 部分指的是輪播圖片之後)
(2)自由更換哪個部分顯示哪個佈局
- 輪播設定(Slider Settings)
(1)選擇是否自動輪播、顯示圖點、輪播時間和輪播切換效果
(2)設定輪播裡的文字顏色、濾鏡顏色(若設定濾鏡顏色,輪播圖片將會變得朦朧)、輪播裡的按鈕背景和文字顏色
- 輪播內容(Slider Content)
(1)上傳輪播圖片、手機版輪播圖片、設定輪播圖片裡的文字、按鈕文字和按鈕導向連結
(2)同樣步驟設定第二第三......張輪播圖片
- 特色商品(Featured Products)
(1)這部分將會顯示「首頁推薦」商品分類裡的商品
- 亮點產品(Highlighted Product)
(1)你可選擇一個熱賣商品,以非常明顯的方式顯示在首頁
- 特色商品目錄(Featured Collections)
(1)這部分可以讓你設定多個推薦的商品目錄,你可上傳圖片、設定文字後,再放入商品分類連結作為導向
(2)以同樣的步驟,設定第二第三..........個特色商品目錄
- 精選推薦輪播(Testimonial Slider)
(1)這部分有別於輪播圖片,一般用途會是顯示客戶使用體驗和反饋(視乎商家的用途需求)
(2)你可勾選「圖形輪廓圖」後,照片就會以圓形顯示
(3)設定其文字顏色、上傳圖片、設定標題、文字、連結導向
(4)以相同步驟,設定第二第三........精選推薦輪播
- 帶文字的圖片(Image With Text)
這部分可以讓你顯示圖片與文字,可以用於顯示優惠活動詳情,或是商品分類內容。
(1)上傳圖片、設定標題和內容文字、連結文字和連結導向
- 影片部分(Video Section)
(1)你可以以 Youtube 連結的方式把影片上傳到官網首頁
- 部落格(Blog Post)
(1)選擇 3 個精選的文章顯示在官網首頁
- Logo 列表 (Logo List)
這部分可以讓你在官網首頁上傳不同的 Logo 列表,可用於顯示合作夥伴的 Logo
- 宣傳欄(Promotional Banner)
這部分可以讓你顯示單一圖片、內容即連結導向
- 手機版目錄(Mobile Menu)
調整手機版導航列目錄的顏色
- 手機版導航列(Mobile Navigation Bar)
設定手機版導航列的圖片、標題、連結導向
- 頁尾(Footer)
設定官網頁尾文字和背景顏色、社群媒體和連結導向、付款方式
步驟四:點擊儲存,完成!
- 點擊儲存後,你可點擊「瀏覽官網」查看你的實際官網前台
💡 小提醒:若是使用 Candy 或 Wave 主題沒有出現中文設定語言,你可以到:編輯原始碼 → config
→ settings_schema.json
→ 點擊右上角 「重設」 按鈕
相關文章:
Updated on: 15/01/2024
感謝!