這是自 Zittme 1.0.0 起隨核心內建的預設佈景主題 heritage XEDITION 的詳細說明手冊。它完整繼承 heritage 佈景主題的結構與設定體系，並以現今的標準重新繪製 XE 時代 XEDITION 版面與 XEDITION 討論區面板的設計（金色重點・深灰・直角區塊・經典表格式討論區），是一款寬版佈景主題。預設支援重點色連動、深色模式與響應式。

與 heritage 佈景主題的差異在於「設計」。版面設定項目、選單類別（m / sl / sf）規則、佈景主題套用方式都與 heritage 相同，因此無論使用哪一款，都能以相同方式經營。

組成

所有組成元件共用相同的設計權杖（顏色・字體・間距・直角邊角）。內文字體為 Pretendard，英文標題與標誌文字使用 Raleway（韓文以 Pretendard 顯示）。

與 heritage 佈景主題的不同之處

套用方式

1. 前往管理員 > 設計設定。
2. 在佈景主題清單中選擇 heritage XEDITION，然後點選套用。
3. 版面與各模組面板會一次套用。若要排除特定組成元件，請在套用畫面中取消勾選。

新安裝 Zittme 1.0.0 的網站，一開始就已套用此佈景主題（版面 + 討論區・會員・站內信面板）。從 Rhymix 或 0.0.x 更新的網站會保留原有設定，因此需要依上述步驟自行套用。

佈景主題套用會記住先前的狀態，因此隨時都能還原到套用前的狀態。使用中的佈景主題，在已安裝佈景主題清單中的刪除按鈕會停用。

版面設定完整項目

請在管理員 > 版面設定中變更，或一邊瀏覽網站，一邊從左下角前台管理列的「版面設定」變更。設定分為 4 個群組（分頁）。

基本

項目	預設值	說明
標誌圖片	無	以高度 40px 為基準顯示。留空則使用標誌文字
深色模式標誌圖片	無	在深色模式下改為顯示的標誌。留空則直接使用預設標誌
標誌文字	無	留空則顯示網站標題。以 Raleway 字體顯示
重點色	#cda25a	一併決定按鈕・連結・啟用標示・個人資料方塊・下拉選單上方線條，以及討論區・小工具面板的強調色
內文最大寬度	1440px	窄 1320 / 預設 1440 / 寬 1600。由於是寬版佈景主題，預設值比 heritage 更寬
選單對齊	緊貼標誌旁	標誌旁 / 置中。頁首永遠使用畫面全寬，此選項只會改變選單位置
選單列顏色	深色	深色 / 重點色 / 淺色。行動版抽屜選單不受此值影響，永遠為深色調
行動版深色模式按鈕位置	選單抽屜內	選單抽屜內 / 頁首 / 頁尾。電腦版永遠顯示於頁首
行動版語言選擇位置	選單抽屜內	選單抽屜內 / 頁首 / 頁尾。電腦版永遠顯示於頁首。僅在核心啟用兩種以上語言時出現
色彩模式	依訪客裝置設定	自動 / 永遠淺色 / 永遠深色

首頁（主視覺輪播）

項目	預設值	說明
顯示主視覺輪播	僅限主頁形式	僅限主頁形式 / 子頁面也顯示 / 不使用。若未登錄任何投影片則不會顯示
自動切換間隔（秒）	6	設為 0 則不會自動切換
主視覺投影片	無	重複欄位。用新增按鈕登錄多張投影片，並拖曳調整順序

每張投影片的項目：背景圖片、標題、說明、按鈕名稱、按鈕連結、文字對齊（靠左/置中）。

輪播與內文寬度無關，永遠以畫面全寬顯示，高度會依畫面寬度調整在 320px 到 600px 之間。建議使用寬度 1920px 以上的背景圖片。左右箭頭為半透明方形按鈕，頁面指示為方形圓點，目前投影片以縱向較長的重點色長條表示。

內文・側欄

項目	預設值	說明
使用整合搜尋	開啟	是否顯示頁首的搜尋圖示與搜尋覆蓋層
在側欄顯示登入方塊	關閉	在子頁面（LNB）的側欄顯示登入小工具

頁尾

項目	說明
網站介紹文字	頁尾左側介紹文字
公司・聯絡資訊	每一行換行內容會顯示為一個項目（公司名稱・代表人・統一編號・地址等）
版權標示	顯示於下方深色版權列

在網站選單編輯中將項目連結到「頁尾選單」（footer_menu），即會顯示頁尾選單（第 1 層）。版權列右側有回到頂端按鈕，若行動版位置選項設為「頁尾」，深色模式按鈕與語言選擇會顯示於此。

頁面類型（選單類別 m / sl / sf / slx / sfx）

每個頁面以選單類別指定五種標記中的其中一種。

類型	選單類別	外觀
主頁型	m	用於顯示主視覺輪播的首頁。無子標題帶
子頁型	sl	子標題帶 + 左側 LNB（目前選單有下層選單時）+ 內文
全寬子頁型	sf	子標題帶 + 無 LNB，內文為全寬
子頁型（無標題帶）	slx	與 sl 相同，但不顯示子標題帶
全寬子頁型（無標題帶）	sfx	與 sf 相同，但不顯示子標題帶

子標題帶是鋪在內文上方的灰色帶狀區塊，以目前選單名稱作為標題顯示。若與討論區面板的討論區標題功能重複，可用 slx / sfx 關閉標題帶、只使用討論區標題，或反過來保留標題帶並清空討論區標題。

指定方式

1. 在管理員 > 網站選單編輯中開啟選單項目。
2. 在 類別 輸入欄中輸入 m、sl、sf、slx、sfx 其中之一。
3. 儲存後，從該選單進入的頁面會以對應類型顯示。

運作規則：

• 未指定類別的選單會依照版面設定的 版面形式（預設值：子頁）。網站首頁（第一頁）若未指定，會以主頁型顯示。
• 若在下層選單中填入類別，該頁面會以下層值優先於上層；若下層未指定，則繼承上層選單的類別（最多至第 3 層）。
• 類別欄中可與其他類別以空格一起填寫。例如：sfx highlight
• 會員・站內信・zittme Pay・整合搜尋畫面若未指定類別，會自動成為全寬。

與主視覺的搭配

• 主視覺顯示「僅限主頁形式」（預設）+ 首頁選單設為 m：只在首頁顯示輪播的一般配置
• 主視覺顯示「子頁面也顯示」：不論類型，所有頁面上方都會顯示輪播
• 主視覺顯示「不使用」：任何地方都不顯示

LNB（左側下層選單）

在子頁型（sl / slx）頁面中，若目前的第一層選單有下層選單，左側 260px 區域會出現下層選單清單。這是無外框的清單形式，標題下方有分隔線與重點色短線，目前項目以左側 3px 重點色長條標示。有第三層選單的項目會附上右箭頭，展開的下層項目則以轉折箭頭圖示縮排。沒有下層選單的選單只會顯示內文，不顯示 LNB。

頁首與上方選單（GNB）

頁首永遠使用畫面全寬。由左至右依序為標誌、選單、右側工具；向下捲動頁面時，會以縮小後的高度固定在上方，背景變為半透明模糊效果。

• 會顯示在網站選單編輯中連結到「上方選單」（gnb）的項目，最多支援至第 3 層。將滑鼠移到第一層選單上時，該項目下方會開啟深色下拉選單，上方附有 3px 重點色線條。第三層選單會在下拉選單內以縮排顯示。
• 目前頁面所屬的第一層選單會顯示下方 3px 重點色底線。
• 可透過選單對齊選項，將選單緊貼於標誌旁或放在頁首中央。

右側工具由左至右依序如下。

元素	說明
深色模式按鈕	訪客可自行切換淺色/深色（依裝置儲存）
搜尋圖示	點選後會開啟覆蓋頁首的大型搜尋輸入框。可用 X、Esc 或點選外部關閉。關閉使用整合搜尋時會隱藏
語言按鈕	以 KR / EN 等縮寫代碼顯示。點選後會開啟使用中的語言清單，在保留目前頁面的狀態下只切換語言。僅在核心啟用兩種以上語言時出現
個人資料區域	未登入：重點色登入按鈕。已登入：包含個人資料照片 + 暱稱 + 通知鈴的重點色方塊。滑鼠移上去會開啟我的資訊・管理員（具管理權限時）・登出選單

通知鈴會在已安裝通知中心（ncenterlite）模組的網站中顯示，呈現未讀通知數與最近通知清單。此時通知中心的預設浮動小工具會自動關閉。

行動版

在 1024px 以下，選單會隱藏，改由最右側的漢堡按鈕開啟抽屜選單。抽屜以重點色為基底的深色調呈現，包含完整選單（第 3 層）以及登入・我的資訊・管理員連結。深色模式按鈕與語言選擇會依版面設定中「行動版 ... 位置」選項，顯示於抽屜下方工具列、頁首或頁尾其中一處。

討論區面板

在討論區設定 > 面板設定中選擇 heritage_xedition。由於是響應式，不需要另外設定行動版面板。

採用 XEDITION 討論區面板的經典表格形式。列表置於上下兩條粗分隔線之間，標題列以淺色背景搭配雙線邊框收尾。公告列以淡灰色背景區分。

項目	說明
討論區標題・說明	在面板設定中輸入後，列表上方會顯示討論區標頭（標題 + 重點色短線 + 說明），發文按鈕會移到標頭右側。留空則不顯示標頭，發文按鈕放在列表下方的按鈕列。閱讀文章畫面不會顯示標頭
列表形式	列表型 / 卡片型（縮圖）/ 網誌型（縮圖 + 摘要）/ FAQ 型（點選問題時展開答案）
作者對齊	靠左 / 置中
顯示個人資料照片・簽名・附件	閱讀文章畫面中是否顯示
推薦・不推薦按鈕	是否使用（預設：只使用推薦）

• 留言數會以 +N 顯示在標題旁。
• 新文章標示為標題前方的 7px 重點色方形點，依照討論區設定的「新文章標示時間」（預設 24 小時）。
• 閱讀文章畫面不使用深色標題列，而是由大標題與帶底線的資訊列（作者・日期・瀏覽・推薦）組成。
• 按鈕為扁平的淺灰色方形按鈕，滑鼠移上去時會填滿重點色。主要動作按鈕（送出・發文）一開始就是重點色。
• 分頁為無邊框的數字排列，只有目前頁面以重點色數字與底線標示，最前/最後為雙箭頭圖示。
• 縮圖以直角裁切。
• 強調色與版面的重點色連動。

會員・站內信面板

分別在會員模組設定與站內信設定中選擇 heritage_xedition。

• 畫面上方有標題，下方附重點色短線，標題與內文之間保留充足的留白。
• 我的頁面・收件匣的個人資料區域以卡片顯示，內含 52px 個人資料照片 + 暱稱 + 等級・註冊日期，卡片上方附 3px 重點色線條。
• 左側導覽選單與版面 LNB 採用相同的語法（分隔線標題 + 左側 3px 啟用長條）。
• 輸入框・下拉選單・按鈕高度皆統一為 46px，排在同一行時不會錯位。按鈕與討論區相同，為扁平方形按鈕。
• 在行動版中，個人資料卡片與搜尋表單會垂直堆疊。

小工具面板

整合內容小工具與整合電商小工具中內含「heritage XEDITION」面板（內含於核心小工具，無需另外安裝）。

• 不使用外框，而是以標題列下方的分隔線與重點色短線劃分區域（與討論區標頭相同的語法）。
• 分頁型只畫一條延伸到底的分頁列，「更多」連結位於分頁列右側。
• 留言數 +N、新文章方形點、直角縮圖等標示方式與討論區面板相同。

深色模式

• 色彩模式為「自動」時，會依照訪客裝置的淺色/深色設定，訪客也可以用頁首的切換按鈕自行變更（依裝置儲存）。
• 深色調色盤是搭配金色重點的暖炭灰（帶有褐色調的深灰色）。討論區・會員・站內信・電商・小工具面板都會一併切換。
• 若另外登錄深色模式標誌圖片，深色模式下會改為顯示該標誌。若未登錄則直接使用預設標誌，因此建議使用透明背景的標誌。

變更重點色

若要使用其他顏色取代預設金色（#cda25a），只需變更版面設定中的重點色即可。按鈕・連結・啟用標示・個人資料方塊・下拉選單上方線條・討論區與小工具的強調色，連同核取方塊・選項按鈕等輸入元素的顏色都會一次變更。在深色模式下，會以指定的顏色為基準自動校正亮度。

若以深藏青色或黑色作為重點色，會更接近 XEDITION 原版的單色調氛圍；保留金色則會呈現經典的感覺。

自訂（CSS 變數）

顏色以 CSS 變數管理。大部分只需重點色即可解決，若要更細緻的修改，請在子 CSS 中重新定義變數。直接修改版面檔案，可能會在佈景主題更新時被覆寫。

變數	意義
--hr-brand	重點色（會注入版面設定值）
--hr-brand-dark / --hr-brand-light	重點色的深色・淺色變化（滑鼠懸停、深色模式連結）
--hr-ink	內文文字顏色
--hr-muted	輔助文字顏色
--hr-bg	頁面背景
--hr-surface	卡片・面板背景
--hr-line	分隔線
--hr-nav-bg	下拉選單・頁尾列・行動版抽屜等深色元素的背景
--hr-w	內文最大寬度（版面設定值）
--hr-font-display	標題・標誌用字體（預設 Raleway）
--hr-radius	邊角半徑（此佈景主題為 0）

主頁面配置範例

1. 將首頁選單的類別指定為 m，並登錄 2 張以上主視覺投影片。
2. 用頁面模組建立首頁內文，並以列為單位堆疊整合內容小工具。小工具面板請選擇「heritage XEDITION」。
3. 若有多個討論區，可用分頁型小工具整合在同一區域顯示。
4. 若同時經營購物網站，可用整合電商小工具新增商品列。

常見問題

• 主視覺輪播沒有出現：請依序確認 ① 是否已登錄 1 張以上投影片 ② 主視覺顯示是否不是「不使用」 ③ 目前頁面是否為主頁型（m）（顯示設定為「僅限主頁形式」時）。
• 想移除子頁面上方的灰色帶（標題）：請將選單類別改為 slx 或 sfx。
• 左側選單（LNB）沒有出現：必須是子頁型（sl / slx），且目前的第一層選單必須有下層選單。
• 將選單移到中央後，啟用選單旁出現細細的直線：這是 1.0.0 的問題。請將佈景主題更新至 1.0.1 以上。
• 深色模式沒有套用：請確認色彩模式是否固定為「永遠淺色」。
• 部分模組畫面是預設設計：請確認該模組設定中的面板是否已選擇 heritage_xedition。佈景主題批次套用只會套用到連結至網站選單的模組，因此像聯絡這類未連結到選單的模組，請在模組設定中個別選擇。
• 變更重點色後只有部分改變：可能是快取造成的。請在管理員 > 重新產生快取後重新整理。
• 英文標題字體看起來不一樣：標題與標誌文字的英文以 Raleway（Google 字型）顯示。在外部字型載入被封鎖的環境中，會以 Pretendard 替代。
• 從 Rhymix 更新後佈景主題沒有套用：更新會保留既有的設計設定。請在管理員 > 設計設定中自行套用 heritage XEDITION。