新增頁面與 Vibe 畫布

Vibe 畫布是秒站用來新增自由頁面的頁面類型。你可以從頁面編輯器建立 Vibe 畫布,再選擇用「頁面編輯器」或「直接編輯(Vibe Coding)」開始製作。

Vibe 畫布可使用頁面編輯器原生區塊、頁面編輯器自訂 HTML 或 Gutenberg 自訂 HTML 三種工作流
Vibe 畫布是頁面;頁面編輯器與 Gutenberg 是編輯工具,Vibe Coding 則是可在兩種工具中使用的製作方法。

從頁面編輯器新增 Vibe 畫布#

  1. 進入秒站控制中心的「網站設定 → 頁面編輯器」。
  2. 點擊上方頁面列旁的「+」。
  3. 選擇「Vibe 畫布頁」。
  4. 輸入頁面標題,例如「品牌故事」。
  5. 輸入網址代稱,例如 our-story。網址代稱為必填,只能使用英文小寫、數字與連字號。
  6. 點擊「下一步」,選擇「頁面編輯器」或「直接編輯(Vibe Coding)」。
  7. 系統建立頁面並開啟所選工具後,即可開始編輯。
秒站頁面編輯器的新增頁面視窗,可建立 Vibe 畫布或恢復已停用頁面
按下頁面列旁的新增按鈕後,可建立 Vibe 畫布,也可恢復先前停用的內建頁面。

兩種編輯工具怎麼選#

新增 Vibe 畫布時可選擇頁面編輯器或直接編輯 Vibe Coding
兩個選項建立的都是 Vibe 畫布,差別在於建立後先開啟哪一套編輯工具。

選擇頁面編輯器#

適合用秒站原生區塊快速組版。文字、圖片、按鈕、表單與動態列表都能分開設定,也方便日後交由其他人維護。

想做 Vibe Coding 也不必離開頁面編輯器。新增「自訂 HTML」區塊後,即可貼入 AI 生成的 HTML、CSS 或 JavaScript,還能把它排在任意兩個原生區塊之間。

選擇直接編輯(Vibe Coding)#

系統會開啟 WordPress 的 Gutenberg 編輯器,並準備自訂 HTML 區塊。這是原本的 Vibe 畫布工作流,適合熟悉 Gutenberg,已有整頁程式碼,或偏好集中編輯完整 HTML 的使用者。

沒有唯一正確的選法:兩種工具都會產生可發佈的 Vibe 畫布。以原生內容為主,或想混合原生區塊與 AI 程式碼時,選頁面編輯器;已有完整程式碼並習慣 Gutenberg 時,選直接編輯。

建立後還能使用另一套工具嗎#

可以。同一張 Vibe 畫布可以保留 Gutenberg 內容,也能加入頁面編輯器區塊。不過前台顯示順序固定為 Gutenberg 內容在前,頁面編輯器區塊接在後方。

如果要讓 AI 程式碼出現在兩個原生區塊中間,請直接在頁面編輯器加入「自訂 HTML」。只用 Gutenberg 製作的既有畫布,可從 WordPress 後台的「Vibe 畫布」清單找到;已有頁面編輯器區塊的畫布,也可從頁面編輯器的頁面列切換。

恢復已停用的內建頁面#

如果關於或服務等內建頁面曾被停用,點擊「+」後選擇「恢復已停用頁面」,勾選頁面並按「恢復選取頁面」。完成後,頁面會重新出現在上方頁面列。

延伸閱讀#

常見問題

Vibe 畫布和頁面編輯器有什麼差別?

Vibe 畫布是可獨立發佈與設定網址的頁面;頁面編輯器是製作頁面的工具。建立 Vibe 畫布後,可以選擇頁面編輯器,也可以使用 Gutenberg 直接編輯。

想做 Vibe Coding,一定要選直接編輯嗎?

不用。頁面編輯器也有自訂 HTML 區塊,可以貼入 AI 生成的 HTML、CSS 或 JavaScript,並與秒站原生區塊混合排版。

網址代稱可以留空嗎?

不行。建立 Vibe 畫布時,頁面標題與網址代稱都是必填欄位。網址代稱只能使用英文小寫、數字與連字號,例如 our-story。

同一張 Vibe 畫布可以同時使用 Gutenberg 和頁面編輯器嗎?

可以,但前台會先顯示 Gutenberg 內容,再顯示頁面編輯器區塊。若要把 AI 程式碼放在兩個原生區塊中間,請使用頁面編輯器的自訂 HTML。

停用的內建頁面要怎麼找回?

在頁面編輯器上方點擊加號,選擇恢復已停用頁面,再勾選要恢復的頁面。完成後,頁面會重新出現在頁面列。