區分文章與頁面
文章具時序性用於部落格，頁面為靜態資訊（如：關於我們），需手動建立頁面來展示文章。
WordPress 從零開始輕鬆架站！#02 網頁版型設計/佈景主題/自訂頁首頁尾
✓ 這篇在你的庫裡
在摘要庫開啟 →
這部在講什麼教學
本片教導如何使用 Elementor 視覺化編輯器進行網頁排版，並透過 Astra 佈景主題自訂網站的頁首與頁尾。
適合誰想要零代碼設計專業 WordPress 網站的初學者。
你會學會掌握 Elementor 容器佈局邏輯、學會響應式網頁微調、完成自訂選單與頁首頁尾設定。
最值得看1:36 深入理解網頁設計核心「Container 容器」的排列與對齊機制。
實作路線
照著做的重點意義優先，時間戳用來導航
Elementor 容器邏輯
網頁由 Container 堆疊而成，透過設定「方向」（上下或左右）與「間距（Gaps）」控制元素排列。
響應式設計調整
利用「響應模式」針對手機或平板獨立微調字體大小與圖文順序，不影響電腦版配置。
破解付費功能限制
Elementor 免費版無法嵌入文章列表，可安裝 Unlimited Elements 外掛作為免費替代方案。
Astra 全域自訂
進入「自訂」介面可統整修改全站字型、配色，並以視覺化鉛筆圖示快速更換 Logo 與導覽列。
頁尾設計規範
建議頁尾採用深色系以展現專業感，並需注意淺色文字與背景的對比度以提高可讀性。
看完可以做什麼
安裝 Elementor 與 Unlimited Elements 外掛，將預設範本頁面改為中文，並設定文章列表的分頁功能。需要留意：Elementor 原生的頁首頁尾編輯需付費，本教學是透過 Astra 佈景主題提供的免費自訂功能來達成。
生成於 2026-07-11
檢舉
觀眾怎麼看
整理 26 則有效留言信心 高觀眾高度肯定教學品質與圖示輔助，同時針對 Elementor 操作細節與網站架設問題提出大量技術諮詢。
觀眾普遍認為教學內容清晰、圖示輔助理解效果佳，對系列影片持續更新表達高度期待。
多位觀眾回報在使用 Elementor 編輯時遇到版面跑版、無法編輯、字體調整無效或編輯器消失等問題。
部分觀眾認為視覺化拖拉編輯模式限制多且不便，偏好傳統程式碼編輯，亦有疑慮其效能負擔。
觀眾敲碗希望後續能涵蓋金流串接（如 TapPay）、Logo 設計及卡片筆記軟體等相關主題。
有觀眾反映使用影片推薦的主機服務後，發生帳號認證問題導致網頁資料遺失，需留意備份與服務穩定性。
留言樣本數有限，且部分技術問題可能源於個別設定差異，非所有觀眾皆有相同體驗。