There is no item in your cart
在製作 WordPress 網站時,許多人都會面臨同一個問題:產品參數、價格比較、功能說明、案例數據……若全部以純文字呈現,不僅影響閱讀體驗,更不利於用戶快速獲取所需資訊。
其實,WordPress 添加表格的方式相當多元。以下為六種常見方法的完整整理:
一、使用 Gutenberg 區塊表格
WordPress 內建的區塊編輯器已支援表格功能,直接新增「表格」區塊即可使用。此方式的優點是操作簡單、無需安裝外掛,適合文章中簡單的數據展示。然而,其缺點亦相當明顯:樣式調整受限,不適合用於複雜的產品參數表。
二、使用專業表格外掛
若需要排序、搜尋、分頁、回應式展示等功能,則可考慮使用表格外掛。例如產品列表、價格方案、數據統計等場景,專業外掛能提供更豐富的功能支援。
- ✅ 支援篩選與排序
- ✅ 可匯入 Excel 數據
- ✅ 樣式選擇更為多樣
此方式相當適合企業網站及內容型網站使用。
三、使用頁面編輯器製作
若使用 Bricks、Elementor 等可視化建站工具,可直接拖入表格元件。此種方式的最大優勢在於設計自由度極高,可根據網站風格自由調整顏色、間距及回應式效果。對於企業官網而言,這種方式更為靈活彈性。
四、使用 HTML + CSS 自訂表格
對於具備開發能力的使用者而言,直接編寫 HTML 表格是最輕量的方法。
- ✅ 載入速度快
- ✅ 程式碼可控性高
- ✅ 無需額外外掛負擔
此方式特別適合固定內容的產品參數、規格說明等場景。
五、使用自訂欄位動態生成表格
若網站擁有大量產品,例如外貿 B2B 網站,可使用 ACF、SCF 等自訂欄位儲存數據,再透過範本自動輸出表格。例如:
| 產品名稱 | 尺寸參數 | 材料 | 應用範圍 |
|---|---|---|---|
| 範例產品 A | 100×50×30cm | 鋁合金 | 工業用途 |
只需維護後台數據,前端即可自動生成,大幅減少重複輸入工作,極為適合批量產品管理。
六、使用 Excel 數據匯入
若早已擁有大量 Excel 參數表,可透過匯入工具快速轉換為網站表格。此方式適合產品數量多、數據經常更新的網站,可有效減少重複錄入的時間成本。
如何選擇適合的方式?
選擇哪種方式,主要取決於網站需求:
- 📌 一般文章展示 → Gutenberg 表格
- 📌 產品參數展示 → HTML / 自訂欄位
- 📌 大量產品管理 → ACF + 範本生成
- 📌 數據查詢展示 → 專業表格外掛
核心思路:不要為了一個簡單表格而安裝十幾個外掛。WordPress 建站的核心原則是:功能够用就好,結構越簡單,網站才能長期穩定運行。
