Goungyeol 佈景主題（美妝購物網站）

這是為化妝品・美妝購物網站打造的 Zittme 官方佈景主題 Goungyeol（goungyeol）的使用手冊。如同美妝選品店般保留寬敞的白色留白，在方角卡片上放大商品相片，並以玫瑰桃紅重點色與腮紅象牙白構成色調。與 Sinsunhan 佈景主題使用相同的骨架（佈景主題內建首頁、以重複欄位組合區塊），本文未提及的內容請一併參閱 Sinsunhan 佈景主題文件。

示範：shopdemo2.zitt.me

組成

安裝與套用

1. 從商店安裝，或解壓縮到 themes/goungyeol。
2. 在管理員 > 設計設定中選擇 Goungyeol 並套用。
3. 若有電商模組，商店選單・頁首搜尋・首頁商品區塊會自動串接。若有多個商店模組，請在版面設定 > 首頁組成的「商店模組網址（mid）」中填入 mid。

建議環境：Zittme 1.0.1 以上、電商 0.2.16 以上。這是響應式佈景主題，建議關閉行動裝置專用檢視。

商品卡片的品牌列・評分・排行

• 品牌列：商品的摘要（summary）欄位會顯示為卡片與詳情頁的品牌列。只要在摘要中簡短填入品牌名稱，就會像選品店一樣呈現「品牌 / 商品名稱」兩行標示。（Streetlab 佈景主題是以商品名稱中的 / 分隔，兩者方式不同。）
• 評分・評論數：在卡片上一併顯示電商商品評論的平均評分與評論數。沒有評論的商品不會顯示。
• 排行名次・特價徽章：排行區塊會在卡片上疊加名次數字，折扣商品則疊加折扣率徽章。

佈景主題內建首頁（首頁組成）

在版面設定 > 首頁組成分頁的「首頁區塊」重複欄位中依序組合。若一個都沒有，則使用預設組成。

區塊種類	內容	來源（source）	數量（count）
商店分類磚	第一層分類捷徑。圖示取自「分類圖示」重複欄位	-	磚塊數
推薦 / 新品 / 折扣 / 熱門商品	商品卡片格狀排列	-	商品數
每日特價	折扣率較高的商品每天輪替一件	-	-
進行中的企劃活動卡片	以圖片卡片呈現電商企劃活動	-	卡片數
即時熱門排行	依購買數 → 瀏覽數排序第 1～N 名	-	名次數
橫幅帶	將主視覺投影片的圖片重複用作中段橫幅	第幾張投影片的編號	-
編輯專欄	一格相片 + 一格文字。直接使用主視覺投影片的圖片・標題・說明・按鈕	第幾張投影片的編號（留空為 1）	-
討論區最新文章	討論區文章列表。以逗號填入多個 mid 時分欄顯示	討論區 mid（例：notice,board）	文章數

編輯專欄區塊的製作方式

1. 在版面設定 > 首頁 > 主視覺投影片中，再登錄一張填好相片・標題・說明・按鈕的投影片。（若不想在輪播中顯示，請將投影片順序排在後面，並在「顯示主視覺輪播」中調整數量。）
2. 在首頁區塊中新增「編輯專欄」，並在來源填入該投影片的編號。
3. 區塊標題留空時使用預設標題，填寫時則以該文字作為小標籤顯示。

商店畫面（電商面板）

• 列表：分類分頁・搜尋・排序。卡片上有品牌列（摘要）・評分・特價徽章。
• 詳情：品牌列・商品名稱・價格・回饋優惠・運費・選項・立即購買・購物車。商品管理中的「附加資訊」會以表格顯示在摘要下方。
• 企劃活動・購物車・訂單・我的購物：流程與 Sinsunhan 佈景主題相同，付款則銜接至 zittme Pay 面板。

頁尾

在版面設定 > 頁尾中填寫網站介紹文字、客服電話・服務時間・電子郵件、社群網址、底部說明文字、營業登記・聯絡資訊與版權標示。

版面設定完整項目

基本

Logo 圖片・深色模式 Logo・Logo 文字・重點色・內文最大寬度（1060・1180・1320）・選單列寬度・選單列顏色・行動版深色模式按鈕位置・行動版語言選擇位置・色彩模式

首頁

顯示主視覺輪播・自動切換間隔・主視覺投影片（背景圖片・標題・說明・按鈕名稱・按鈕連結・文字對齊）

首頁組成

分類圖示・商店模組網址（mid）・首頁區塊（種類・標題・來源・數量）

內文・側欄

使用整合搜尋・在側欄顯示登入方塊

頁尾

網站介紹文字・客服電話號碼・服務時間・洽詢電子郵件・4 種社群網址・底部說明文字・營業登記・聯絡資訊・版權標示