如何在你的網站新增部落格：選項、SEO 與設定

要在你的網站新增部落格，請先決定文章要用什麼方式撰寫：如果你或工程師會寫，就在專案中使用 Markdown 檔案；如果非技術人員會寫，就用附管理編輯器的資料庫；如果你想要完整的編輯工具，就用 CMS。接著把部落格放在主網域的 /blog 路徑下，包含列表頁、每篇文章一個頁面，以及 RSS 訂閱。對於搜尋引擎，請確保每篇文章都以真正的 HTML 提供，擁有各自的標題、描述與分享圖片，並且出現在你的網站地圖中。AI 應用建置工具可以根據一段提示建置上述任何一種方式；選擇主要取決於誰會撰寫文章。

選擇文章的撰寫方式

這是最重要的決定，技術選項會依此而定。

一個實用的原則：如果你習慣用純文字檔案寫作，Markdown 最簡單，提供內容的速度也最快。如果「提交（commit）」與「重新部署」這些字眼會讓你或團隊不想發文，那就選擇編輯器。

子資料夾還是子網域？

• 子資料夾（example.com/blog）：一個網站、一種設計、一套分析數據，部落格文章與你希望排名的頁面位於同一個網域。對大多數企業來說最簡單。
• 子網域（blog.example.com）：只有當部落格運行在另一個無法放在主網站底下的平台時才需要。

如果你本來就是要把部落格建置在自己的網站中，請使用子資料夾。

部落格需要什麼

• 文章列表頁，包含標題、日期、簡短摘要與分頁。
• 文章頁面，閱讀寬度適中（每行大約 60 到 80 個字元）、標題層級清楚，並妥善處理圖片。
• 乾淨的網址：/blog/how-to-choose-a-caterer，而不是 /blog?id=17。
• 每篇文章各自的標題與 meta 描述，以及 Open Graph 標籤，讓分享的連結顯示正確的預覽。
• 每篇文章都要有網站地圖項目，並提供給讀者與電子報工具使用的 RSS 訂閱。
• 作者與日期，修改時還要有「更新」日期。
• 文章數量足夠之後，加入分類或標籤。
• 草稿功能，讓未完成的文章保持私密。

SEO：讓文章成為真正的頁面

許多用現代工具建置的網站都是單頁應用：瀏覽器下載 JavaScript，再由它繪製頁面。這對應用程式來說沒問題，但部落格依賴搜尋與連結預覽，而只在瀏覽器中繪製的頁面，對某些爬蟲與社群預覽來說比較難讀取。對部落格來說，請要求文章採用預先渲染（在建置網站時轉換成 HTML）或伺服器端渲染，讓每個文章網址都能立即回傳完整的內容、標題與描述。

我們的AI 建置網站的 SEO 指南更深入地涵蓋了標題、網站地圖與結構化資料。

提示範例

Markdown 部落格：

在 /blog 新增一個部落格。每篇文章是 content/blog 中的一個 Markdown 檔案，頂部包含標題、描述、日期，以及選填的封面圖片。建置一個列表頁（最新的在前，每頁 10 篇），以及每篇文章一個頁面，路徑為 /blog/[slug]。將所有部落格頁面預先渲染為靜態 HTML，讓每一頁都有自己的標題、meta 描述與 Open Graph 標籤。把文章加入 sitemap.xml，並在 /blog/rss.xml 產生 RSS 訂閱。

附編輯器的部落格：

新增一個部落格，文章存放在資料庫中：標題、slug、摘要、內文（Markdown）、封面圖片、狀態（草稿或已發布）、發布日期。新增一個受密碼保護的管理區域，用來建立、編輯、預覽與發布文章，並支援上傳封面與內文圖片。只有已發布的文章會出現在 /blog 上。在伺服器端渲染每個文章頁面，並使用各自的標題與 meta 描述。

潤飾：

改善部落格文章的版面：舒適的閱讀寬度、較大的行距、有樣式的標題、程式碼區塊與引言、響應式圖片，並在底部加上「上一篇／下一篇文章」連結。保留網站現有的顏色與字型。

逐步操作

1. 決定誰來撰寫，並選擇 Markdown、資料庫 + 編輯器，或 CMS。
2. 選定網址結構：/blog 與 /blog/post-slug。
3. 依照上述版面基本原則，建置列表頁與文章頁。
4. 為每篇文章新增中介資料：標題、描述、分享圖片、日期。
5. 讓文章可被爬取：預先渲染或伺服器端渲染，然後檢查：查看文章的網頁原始碼，文章內文應該已經在裡面。
6. 新增網站地圖與 RSS 訂閱。
7. 處理圖片：壓縮、設定尺寸、加上替代文字。如果使用編輯器，請把上傳檔案存放在檔案儲存空間中（參閱如何為應用新增檔案上傳）。
8. 上線前先寫兩到三篇文章，讓部落格不會看起來空蕩蕩的。
9. 發布後，在 Google Search Console 提交網站地圖。

常見錯誤

• 選了一種沒有人會使用的設定。 如果團隊不會碰檔案，Markdown 部落格會一直空著。
• 文章只在瀏覽器中渲染。 分享時會顯示空白預覽，搜尋引擎可能讀取到的內容更少。
• 每篇文章的標題與描述都一樣。 每篇文章都需要獨立的標題與描述。
• 發布後更改 slug。 這會讓連結失效；如果一定要改，請加上重新導向。
• 巨大且未壓縮的圖片。 它們會拖慢每一篇文章。
• 沒有草稿功能。 寫到一半的文章會意外上線。
• 寫自己，而不是寫客戶的問題。 有用的解答能帶來流量；公告很少有這種效果。

檢查清單

• 撰寫方式與實際會寫文章的人相符
• 部落格位於主網域的 /blog 下
• 每篇文章都有乾淨且穩定的網址
• 每篇文章都有獨特的標題、描述與分享圖片
• 文章 HTML 包含完整的內文（查看網頁原始碼確認）
• 網站地圖與 RSS 訂閱包含所有已發布的文章
• 草稿保持私密
• 圖片已壓縮，並有替代文字
• 上線前已撰寫數篇文章

用 Mythex 新增部落格

在 Mythex 上，你可以透過聊天新增任一種部落格。若是基於編輯器的部落格，文章會存放在專案的資料庫中，圖片則存放在檔案儲存空間，這兩項在應用需要時 Mythex 都會啟用。Mythex 的文件指出，新建的應用預設常是 Vite 單頁應用，其 SEO 比伺服器端渲染或靜態 HTML 來得弱，因此對部落格而言，請要求文章頁面採用預先渲染或靜態方式，或採用 Next.js 的設定。參閱已發布應用的 SEO，並在變更後重新發布。

如果你是從零開始，請參閱如何用 AI 建置網站與如何建置小型企業網站。

常見問題