首頁架構導覽
本篇文章將帶領大家進行網站「首頁」的導覽,建立對網站「首頁」編輯的基本概念。
備註說明:每個網站的設計模組、功能與目標族群皆不同,因此本文將介紹大部分網站通用的架構及基本項目。
一、認識首頁架構
網站首頁由多個模組組成,基本的模組架構搭配大多為:
LOGO、主選單、副選單、Banner 模組、3~6 個首頁模組、頁尾模組。
實際呈現的方式大多如下圖:

二、首頁編輯
🏠首頁內容編輯
🚀 操作路徑: 首頁 ❯ 編輯內容 ❯ 進入「首頁模組」進行編輯
點擊後會跳出一個與前台一致的編輯視窗,方便您對應區塊編輯,點擊「鉛筆圖示」即可執行編輯。
💡 編輯小技巧:
「首頁 > 編輯內容」主要是編輯首頁模組的內容。原則上,只要出現在首頁的項目,都是從這裡編輯。
若找不到該項目,可能是設計師透過特殊語法製作,歡迎詢問營輔顧問。
「首頁 > 編輯內容」主要是編輯首頁模組的內容。原則上,只要出現在首頁的項目,都是從這裡編輯。
若找不到該項目,可能是設計師透過特殊語法製作,歡迎詢問營輔顧問。
三、網站選單模組(主選單、子選單)
📋網站主選單
主選單是使用者在網站中最主要的導覽工具,建議將主選單控制在合理數量(約5~7個)。
若項目過多,會造成重要頁面容易被淹沒、使用者操作不直覺、版面雜亂等問題。
💡 簡單原則:精簡且有邏輯的主選單,可以幫助使用者更快找到重點,提升轉換成效。
🚀 操作路徑: 內頁 ❯ 點選欲修改的主選單名稱旁的齒輪圖示 ❯ 版面設定
1.修改主選單名稱
2.開啟/隱藏主選單設定
Q:管理者可以自行「新增」前台的主選單嗎?
A:不行。 新增選單涉及版型結構,請洽詢您專屬的營運輔導顧問,由工程師協助開啟。
A:不行。 新增選單涉及版型結構,請洽詢您專屬的營運輔導顧問,由工程師協助開啟。
📄網站子選單
若原本的網站主選單沒有下拉式選單(如下圖),欲增加子選單(下拉式選單),米洛提供「自訂子選單」、「開立新選單」或「付費調整樣式」三種方案。
方案 A:自訂子選單
💡 適用場景:原本樣式無下拉選單,或需連結至不同架構頁面時。
🚀 操作路徑: 首頁 ❯ 編輯內容 ❯ 點選「選單」區塊

🚀 操作路徑: 選擇欲修改的主選單 ❯ 子選單內容選擇「自訂」 ❯ 新增 ❯ 輸入子選單名稱及連結 ❯ 儲存

前台顯示如下:
方案 B:開立新選單
請洽詢您專屬的營運輔導顧問,由工程師協助開立一個新樣式的選單,選單開立完成後需自行搬移資料。
方案 C:付費調整
由設計師直接調整原選單樣式,此方案需設計師工時費用,如欲評估請洽詢您專屬的營運輔導顧問。
🔗網站副選單
通常位於右上方,包含會員、購物車、搜尋等圖示項目。

四、更換網站 LOGO 圖片
🎨LOGO 更換流程
🚀 操作路徑: 全站設定 ❯ 基本設定 ❯ 基本資訊
從電腦中選取您新的 LOGO 圖檔重新上傳。
💡 LOGO圖片更換注意事項:
Q:更換網站 Logo 時,要如何知道正確的圖片尺寸呢?
A:每個網站的LOGO大小、位置皆不同,因此您所製作的LOGO新圖,務必與設計師幫您首次製作的預設尺寸一致,以確保版面美觀。
Q:更換網站 Logo 時,要如何知道正確的圖片尺寸呢?
A:每個網站的LOGO大小、位置皆不同,因此您所製作的LOGO新圖,務必與設計師幫您首次製作的預設尺寸一致,以確保版面美觀。

五、更換網站 Banner 圖片
🖼️更換 Banner 圖片
🚀 操作路徑: 首頁 ❯ 編輯內容 ❯ Banner 區塊編輯(鉛筆)
點選「新圖上傳」並從電腦中選取新的 Banner 圖檔重新上傳。
💡 Banner圖片更換注意事項:
Q:更換網站 Banner 時,要如何知道正確的圖片尺寸呢?
A:您所製作的LOGO新圖,務必與設計師幫您首次製作的預設尺寸一致,並依照「不同裝置版本」上傳相對應的預設尺寸,以確保Banner在不同裝置上都能完美呈現。
Q:更換網站 Banner 時,要如何知道正確的圖片尺寸呢?
A:您所製作的LOGO新圖,務必與設計師幫您首次製作的預設尺寸一致,並依照「不同裝置版本」上傳相對應的預設尺寸,以確保Banner在不同裝置上都能完美呈現。

六、首頁彈出視窗
🔔彈窗設定方式
首頁彈出視窗通常用來即時傳達重要訊息,讓瀏覽者一進網站就能看到重點內容,像是活動、公告或優惠。🚀 操作路徑: 首頁 ❯ 首頁彈出
方法 A:放置純文字
- 進入「首頁彈出」。
- 在編輯器內輸入文字並點擊存檔。
方法 B:插入圖片 (推薦)
進入「首頁彈出」,點擊編輯器上方「圖片」圖示,上傳並選擇檔案。
關鍵步驟:影像屬性設定
插入圖片後,請在圖片上點擊滑鼠「右鍵」 > 選擇「影像屬性」。
務必將寬度設為 100%,並將高度留空白,這能確保您的公告在手機版上自動縮放而不變形。

本教學旨在引導初次登入的使用者,若想深度了解更多常用功能,請詳閱後續章節。