頁面編輯展開目錄
頁面編輯目前可使用

頁面與導覽管理

新增、改名、排序或刪除頁面,並決定哪些頁面出現在網站導覽。

共 5 項操作・21 個步驟・最後複驗 2026-10-03

從哪裡進入

視覺編輯器 → 頁面

照著下方圖文逐步完成

重點摘要(TL;DR)

頁面設定會改變網站結構與網址,並連動導覽選單;草稿中可先預覽,發布後才影響訪客。

什麼時候會用到

  • 想新增關於我們、服務或常見問題頁
  • 想調整導覽列順序

開始前先準備

  • • 先進入要修改的網站編輯器
  • • 網站擁有者、共同管理者或內容編輯可以管理頁面;站點人員不能編輯版面

圖解與實際畫面

網站導覽列上新出現的「常見問題」連結,以綠框標示
綠框是確認點:新頁面已經自動出現在導覽列。

操作步驟與完成後的結果

每一項操作都列出從哪裡開始、要做什麼,以及完成後應該看到的結果。

1

新增頁面

替不同主題建立獨立網址與可編輯畫布,並自動在導覽列補上連結。

新增一頁並讓它出現在導覽列:頁面名稱、網址與選單順序

繁體中文字幕預設開啟;若和瀏覽器即時字幕重複,可在這裡關閉。

動畫教學片頭:anting.tw 標誌與「新增一頁並讓它出現在導覽列」標題。影片附可開關的繁體中文字幕、逐字稿與章節索引,也可以下載 MP4。

  1. 1

    這一步要做

    在編輯器上方點目前的頁面名稱,展開頁面清單。

    為什麼:頁面清單是整個網站的地圖;新增、改名、刪除與上下線都從這裡開始。

    編輯器上方顯示目前頁面名稱的按鈕,以紅框精準標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    紅框是現在要按的位置:編輯器上方顯示目前頁名的那一格。
    1. 1操作
      位置:
      編輯器最上面一排,靠左顯示目前頁名的那一格。
      動作:
      按一下它。
      結果:
      下方展開整個網站的頁面清單。

    完成後會看到

    下方列出這個網站目前所有頁面與它們的網址。

  2. 2

    這一步要做

    按清單最下面的「新增頁面」。

    為什麼:表單就地展開,先把頁名與網址想好再按新增,之後就不必回頭改網址。

    頁面清單最下方的「新增頁面」按鈕,以紅框精準標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    紅框是現在要按的位置:清單最下面的「新增頁面」。
    1. 2操作
      位置:
      頁面清單最下面一列。
      動作:
      按「新增頁面」。
      結果:
      就地展開「頁面名稱」與「網址」兩個欄位。

    完成後會看到

    清單就地展開「頁面名稱」與「網址」兩個欄位。

  3. 3

    這一步要做

    填頁面名稱,再填一段英文小寫的網址,按「新增」。

    欄位怎麼填

    頁面名稱
    後台與導覽列看得到的頁名,例如「常見問題」。必填,留空時「新增」按不下去。
    網址
    填英文小寫,例如 faq、pricing、courses。英文頁名會自動帶出,中文頁名要自己填。撞到系統保留字時欄位會變紅並說明原因。
    新增頁面表單的「頁面名稱」欄位,以紅框精準標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    紅框是正在填寫的欄位:頁面名稱。
    1. 3操作
      位置:
      新增頁面表單上方的「頁面名稱」欄位。
      動作:
      輸入訪客看得懂的頁名,例如「常見問題」。
      結果:
      名稱填好後,下方的「新增」按鈕才會亮起來。
    新增頁面表單的「網址」欄位,以紅框精準標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    紅框是正在填寫的欄位:網址,請用英文小寫。
    1. 3操作
      位置:
      「頁面名稱」下面的「網址」欄位。
      動作:
      輸入英文小寫的網址代稱,例如 faq;不要用中文。
      結果:
      欄位顯示 /faq,這就是訪客會看到的網址。
    新增頁面表單的「新增」按鈕,以紅框精準標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    紅框是現在要按的位置:「新增」。
    1. 3操作
      位置:
      新增頁面表單最下面、「取消」右邊的藍色按鈕。
      動作:
      確認名稱與網址後按「新增」。
      結果:
      頁面建立、畫面切到這一頁的空白畫布,導覽列也自動多一個連結。

    完成後會看到

    新頁面加入清單、畫面切到這一頁的空白畫布,導覽列也自動多一個連結。

    做錯或略過會怎樣

    中文頁名不會自動帶出網址;這格留空,系統會給一段看不懂的亂碼網址,分享出去也不好記。

  4. 4

    這一步要做

    回到畫布,在這一頁用「新增區塊」放進第一段內容;再點導覽列,確認自動補上的那筆選單連結文字與位置是你要的。

    為什麼:空白頁面發佈出去,訪客點進來只會看到頁首頁尾;自動補上的連結也一律排在選單最後面。

    完成後會看到

    新頁面有了內容,導覽列多一個以頁面名稱為文字、指到 /<網址> 的連結。

  5. 5

    這一步要做

    內容還沒寫完、但又想先發佈網站其他修改時,在頁面清單按這一頁右側的眼睛圖示(「改成草稿頁」),再照常按「發佈」。

    為什麼:草稿頁讓你一邊蓋新頁、一邊照常更新網站,不必等整頁完成才能發佈。

    完成後會看到

    清單上這一頁標著「草稿」;發佈時它不會上線,指向它的選單連結也會先藏起來。

注意事項

  • • 網址撞到系統保留字或功能頁網址時,欄位會變紅並說明被誰佔用,「新增」也按不下去。
  • • 但撞到「你自己已有的頁面」不會被擋:兩頁同網址仍然建得起來,訪客只會看到其中一頁,另一頁永遠到不了。填之前先看一眼清單裡的網址。
  • • 中文名稱不會自動帶出網址,「網址」這一格要自己填;留空會得到一段看不懂的亂碼網址。
  • • 「網址」這一格打得進中文,但中文網址分享出去會變成一長串編碼,建議一律用英文小寫。
  • • 頁面名稱留空時「新增」是關著的。
開啟這項操作的獨立教學頁
2

修改頁面名稱與網址代稱

更新後台頁名與訪客進入此頁的路徑。

這一段也收錄在同一支教學影片裡。回到影片查看章節

  1. 6

    這一步要做

    展開頁面清單,在一般頁面右側按鉛筆「編輯頁面」。

    為什麼:頁名與網址在同一個小表單裡改,按「完成」才會套用。

    頁面清單中「常見問題 /faq」那一列右邊的鉛筆按鈕,以紅框精準標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    紅框是現在要按的位置:該列右邊的鉛筆「編輯頁面」。
    1. 6操作
      位置:
      「常見問題 /faq」那一列最右邊,垃圾桶左邊的鉛筆。
      動作:
      按鉛筆。
      結果:
      該列就地變成可輸入的「頁面名稱」與「網址」欄位。

    完成後會看到

    該列變成可輸入的「頁面名稱」與「網址」欄位。

  2. 7

    這一步要做

    修改文字後按「完成」。

    欄位怎麼填

    頁面名稱
    只改後台頁名,不會改導覽選單上的文字。
    網址
    英文小寫加連字號,例如 about-us。首頁固定是 /,不會出現這一格。
    頁面編輯表單的「頁面名稱」欄位,以紅框精準標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    紅框是正在填寫的欄位:頁面名稱。
    1. 7操作
      位置:
      展開中的編輯表單上方欄位。
      動作:
      改成新的頁名。
      結果:
      欄位顯示新名稱,但還沒存檔。
    頁面編輯表單的「完成」按鈕,以紅框精準標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    紅框是現在要按的位置:「完成」,按了才存檔。
    1. 7操作
      位置:
      編輯表單最下面的藍色按鈕。
      動作:
      按「完成」。
      結果:
      清單顯示新名稱;導覽選單上的字不會跟著變。

    完成後會看到

    頁面清單顯示新名稱,非首頁頁面使用新的 /<網址> 路徑。

    做錯或略過會怎樣

    網址跟同網站另一頁或系統保留字撞到時,欄位會變紅、「完成」按不下去;紅字會說明是被哪一頁佔用。

  3. 8

    這一步要做

    改的是網址時,點導覽列打開它的「選單連結」清單看一眼:原本指到舊網址的連結已自動改指新網址;連結上顯示的文字則要自己在「文字」那一格改。

    為什麼:頁面名稱是後台用的頁名,選單上的字是另一份資料,刻意分開,讓你可以用比較短的字當選單。

    完成後會看到

    選單連結指向新網址,顯示的文字也是你要的名稱。

  4. 9

    這一步要做

    按右上角「發佈」。

    為什麼:舊網址可能已經分享出去或被 Google 收錄,自動轉址讓那些流量與搜尋排名不會斷掉。

    完成後會看到

    新網址上線;系統同時替舊網址記一筆轉址,從舊連結進來的人會被帶到新網址。轉址紀錄可在網站設定的「網址轉址」查看。

注意事項

  • • 首頁網址固定為 /,不會出現網址欄位。
  • • 改頁面名稱不會同步改導覽選單上的文字,選單要到「導覽列」的「選單連結」清單另外改。
  • • 站內指向舊網址的按鈕與選單連結會在改網址的當下自動改指新網址(只改完全等於舊網址的連結)。
  • • 發佈後系統會替舊網址自動建立轉址;在發佈之前,正式站仍是舊網址。
開啟這項操作的獨立教學頁
3

調整導覽選單的順序

控制訪客在網站選單看到的連結先後。

這一段也收錄在同一支教學影片裡。回到影片查看章節

  1. 10

    這一步要做

    在畫布點「導覽列」區塊,右側設定面板找到「選單連結」清單。

    為什麼:訪客看到的選單順序,就是這份清單由上到下的順序。

    畫布上的導覽列區塊,以紅框精準標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    紅框是現在要按的位置:畫布上的導覽列,點它打開設定。
    1. 10操作
      位置:
      畫布最上方導覽列的品牌名稱。
      動作:
      點一下導覽列這一段。
      結果:
      右邊打開導覽列設定,裡面有「選單連結」清單。

    完成後會看到

    每個連結右邊出現向上箭頭、向下箭頭與垃圾桶三個圖示。

    做錯或略過會怎樣

    點導覽列後右側沒有出現設定面板時,按導覽列上方工具列的「編輯」把面板打開。

  2. 11

    這一步要做

    用「上移/下移」排好順序;功能自動頁若還沒在選單,可在頁面清單按「加入選單」。

    為什麼:「上移」「下移」一次移一格,排完立刻在畫布上看得到結果。

    選單連結清單中某一列的「上移」按鈕,以紅框精準標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    紅框是現在要按的位置:該列的「上移」。
    1. 11操作
      位置:
      「選單連結」清單裡要移動那一列右邊的向上箭頭。
      動作:
      按向上箭頭。
      結果:
      這個連結在導覽列往前挪一格。
    導覽列上調整順序後的「作品集」連結,以綠框標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    綠框是確認點:導覽列已依新順序排列。
    1. 11核對
      位置:
      畫布最上方的導覽列。
      動作:
      確認連結的先後順序。
      結果:
      訪客看到的先後,就是「選單連結」清單的先後。

    完成後會看到

    導覽列立即依新順序排列。

  3. 12

    這一步要做

    要做下拉子選單時,在「選單連結」清單展開那一筆連結,在它的「子選單」裡新增項目;想替連結加圖示,可以選「圖示(選填)」。

    為什麼:項目多的網站把相關頁面收在同一個母項目下,選單會比較好找。

    完成後會看到

    那筆連結底下多出子項目,手機選單展開時看得到。

    做錯或略過會怎樣

    桌機上只有部分導覽列版型會畫出下拉選單,其他版型的子選單只在手機選單裡展開;用之前先在桌機預覽確認。

  4. 13

    這一步要做

    按「發佈」後,到正式站用桌機與手機各點一次選單,確認順序與連結都正確。

    為什麼:手機選單是另一個抽屜,排版與桌機不同,兩邊都看過才算完成。

    完成後會看到

    兩種裝置的選單順序一致,每個連結都打得開。

注意事項

  • • 一般頁面沒有另一套獨立排序;訪客看到的先後就是「選單連結」清單的先後。
  • • 新增頁面時系統會自動補一筆連結,刪除頁面時卻不會自動移除,需要手動清掉。
開啟這項操作的獨立教學頁
4

隱藏或刪除頁面

讓頁面不出現在選單,或把不再需要的頁面移除。

這一段也收錄在同一支教學影片裡。回到影片查看章節

  1. 14

    這一步要做

    只想把某一頁藏起來時,在「導覽列」設定的「選單連結」清單,按該列最右邊的垃圾桶。

    為什麼:只拿掉選單連結,頁面與內容都還在,適合感謝頁、活動頁這類只給特定人看的頁面。

    選單連結清單中殘留那一列的「刪除項目」按鈕,以紅框精準標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    紅框是現在要按的位置:該列最右邊的垃圾桶,只刪這條選單連結、不動頁面。
    1. 14操作
      位置:
      「選單連結」清單裡那一列最右邊的垃圾桶圖示。
      動作:
      按垃圾桶。
      結果:
      導覽列不再有那個連結。

    完成後會看到

    訪客選單不再顯示連結,但直接輸入網址仍可進入該頁。

  2. 15

    這一步要做

    確定不要頁面時,展開頁面清單,按該頁右側的垃圾桶。

    為什麼:刪除會連同整頁的區塊一起拿掉;之後可能還會用到的頁面,改成草稿頁比較安全。

    頁面清單中該列右邊的垃圾桶按鈕,以紅框精準標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    紅框是現在要按的位置:該列右邊的垃圾桶「刪除頁面」。
    1. 15操作
      位置:
      要刪的那一列最右邊。
      動作:
      按垃圾桶。
      結果:
      頁面立刻移除,不會再問一次;按錯可用「復原」救回。
    頁面已刪除,導覽列上仍留著的「常見問題」連結,以綠框標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    綠框是確認點:刪頁不會一併移除導覽連結。
    1. 15核對
      位置:
      畫布最上方的導覽列。
      動作:
      確認那個連結還在。
      結果:
      它已經指向一個不存在的頁面,要自己去刪掉。

    完成後會看到

    頁面立刻從清單移除,草稿中不再保留其區塊;導覽列上那個連結還在。

    做錯或略過會怎樣

    刪除不會再問一次;按錯請立刻按編輯器上方的「復原」。

  3. 16

    這一步要做

    刪除頁面後,點導覽列打開「選單連結」清單,把指到這一頁的那一列按垃圾桶(「刪除項目」)拿掉。

    為什麼:刪除頁面不會自動移除選單連結;留著的話,發佈後它在正式站只會顯示成不能點的純文字。

    完成後會看到

    選單不再有指向不存在頁面的連結。

  4. 17

    這一步要做

    想讓頁面暫時不對外、但保留內容與網址,在頁面清單按該頁右側的眼睛圖示「改成草稿頁」;要恢復時再按一次(「改成上線頁面」),然後發佈。

    為什麼:草稿頁保留全部內容,之後一鍵就能重新上線,不必重做。

    完成後會看到

    清單上出現「草稿」標籤;發佈時這一頁不會上線,指向它的連結在正式站會先藏起來。改回上線頁面並發佈後就恢復。

    做錯或略過會怎樣

    首頁與 @連結頁沒有這顆按鈕。草稿頁的網址在發佈後打不開,不要把正在推廣的頁面切成草稿。

注意事項

  • • 刪除不會再次確認;按錯請立刻用編輯器上方的「復原」救回。
  • • 刪除頁面不會一併移除導覽列上的連結,記得回「選單連結」清單刪掉那一列。
  • • 網站只剩一頁時不提供刪除,至少要保留一頁。
開啟這項操作的獨立教學頁
5

辨認系統固定頁

分清楚手動頁面與由功能自動建立、網址固定的頁面。

這一段也收錄在同一支教學影片裡。回到影片查看章節

  1. 18

    這一步要做

    展開頁面清單,先看上半部的一般頁面與它們右邊的網址。

    為什麼:一般頁面由你自己用區塊蓋起來,內容全在畫布上。

    頁面清單中「關於」那一列以綠框標示,右側顯示網址 /about

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    綠框是確認點:每一列右邊的灰字就是這一頁的網址。
    1. 18核對
      位置:
      頁面清單裡的「關於」那一列。
      動作:
      看它右邊的灰色文字。
      結果:
      顯示 /about,代表訪客用這個網址進到這一頁。

    完成後會看到

    一般頁面都能用鉛筆改名、用垃圾桶刪除。

  2. 19

    這一步要做

    再往下看帶「自動」標籤的功能頁,需要放進導覽時按「加入選單」,要改內容按「管理內容」。

    為什麼:自動頁的內容來自後台資料(例如文章、作品),網址固定,所以改內容要到後台。

    頁面清單中作品集自動頁那一列的預覽按鈕,以綠框標示

    手機可左右滑動畫面,看清楚紅圈與欄位文字。

    綠框圈的是「預覽」。標「自動」的功能頁就只有這一排動作,沒有鉛筆也沒有垃圾桶;還沒放進選單時,這一排會多一個「加入選單」。
    1. 19核對
      位置:
      頁面清單下半部「作品集 /portfolio」那一列。
      動作:
      看綠框圈住的「預覽」。
      結果:
      這一列只有這一排動作,沒有鉛筆也沒有垃圾桶——代表它是功能自動建立的頁面,網址固定。

    完成後會看到

    系統只新增導覽連結,或開啟對應的管理後台,不會把固定頁變成一般頁面。

  3. 20

    這一步要做

    按自動頁那一列的「預覽」,在編輯器裡直接看這個功能頁目前的樣子。

    為什麼:先看內容齊不齊,再決定要不要加進選單、是否要先到後台補資料。

    完成後會看到

    畫布切到該功能頁的預覽,不會離開編輯器。

  4. 21

    這一步要做

    有開線上販售時,清單還會多一組「商店頁面」(例如「全部商品」「商品分類頁」);點頁名可以在編輯器內預覽,按右側的按鈕(例如「編輯頁面」)調整那一頁的版型與標題。

    為什麼:商店頁不是用區塊蓋的頁面,但版型與標題一樣可以從這裡調整。

    完成後會看到

    畫布切到該商店頁,或開啟它的設定。

注意事項

  • • 系統固定頁的網址與內容由功能管理,不能用一般頁面的鉛筆改名或刪除。
  • • 找不到某個自動頁,通常代表對應的功能還沒開啟。
開啟這項操作的獨立教學頁

遇到問題先看這裡

頁面已建立但導覽列看不到?
新增頁面時系統會自動補一筆選單連結,若之前手動刪過就要到「導覽列」的「選單連結」清單按「新增選單連結」補回來。改完還要按「發佈」,訪客才會看到。系統固定頁則要在頁面清單按「加入選單」。
改了頁面名稱,導覽列上的字沒變?
兩者是分開的。頁面名稱是後台用的頁名;導覽列上的文字存在「選單連結」清單裡,要在那裡一併改。
不小心按到垃圾桶把頁面刪了?
刪除沒有二次確認,但可以復原:立刻按編輯器上方的「復原」(Ctrl+Z),內容不會遺失。
中文頁名打完,網址欄還是空的?
這是正常的。系統只能從英文標題自動帶出網址,中文帶不出來,請自己填一段英文小寫,例如 faq、pricing、courses。
改了網址,舊網址會變成 404 嗎?
不會。發佈時系統會替舊網址自動記一筆轉址,從舊連結進來的人會被帶到新網址;站內指向舊網址的按鈕與選單也會在改網址當下自動改指新網址。轉址紀錄可在網站設定的「網址轉址」查看。
頁面清單上的「沒有連結」是什麼意思?
這一頁在網站裡沒有任何連結指過來(選單、按鈕、頁尾都沒有),訪客只能直接輸入網址才到得了。把它加進導覽列,或在相關頁面放一顆按鈕連過去,標籤就會消失。
頁面清單上的「自動主標」或「2 個 H1」是什麼?
「自動主標」代表這一頁沒有區塊提供主標題,平台替搜尋引擎補了一個看不見的主標;想自己決定,把某個區塊的「標題層級」改成「頁面主標 H1」。「2 個 H1」這類標籤代表多個區塊各自輸出主標題,搜尋引擎會抓不到重點,換掉其中一個的版型或調整順序。
不是這個問題?查全部排除方法

逐步操作

需要一步一步做時,接著看詳細教學

相關功能

還是沒解決?

依你看到的狀況查一次問題排除,通常比找功能名稱快。真的卡住就直接告訴我們,把你正在做的事和畫面上的訊息寫進來就好。