重點整理
Elementor 的 Posts（文章）小工具可以在任何頁面放一個自動更新的文章列表，是 Elementor Pro 功能。版面有 Classic、Cards、Full Content 三種外觀，可設定欄數、每頁篇數、圖片比例、摘要長度與 Meta 資料；Query 可選文章、頁面、自訂文章類型、手動選擇、目前查詢或相關文章，並依分類、作者、日期篩選。下面依序說明安裝 Elementor Pro、加入小工具、設定版面與查詢、分頁、樣式和手機版顯示。
部落格首頁的「最新文章」、服務頁下方的「相關案例」、首頁的「最新消息」，本質上都是文章列表：從資料庫抓出符合條件的文章，依固定格式排出來，發新文章時自動更新。Elementor Pro 的 Posts 小工具不用寫程式就能做到，而且來源不限一般文章，頁面和自訂文章類型也能列。這篇從安裝 Pro 開始，一步步做出一個文章列表區塊。
步驟一：購買並安裝 Elementor Pro
Posts 小工具只有 Elementor Pro 才有。先到 Elementor 定價頁選擇方案（2026 年 10 月最入門的 Essential 方案首年 US$49、1 個網站），付款後就能取得授權。Elementor Pro 沒有免費版，安裝前建議先確認網站的 WordPress 與 Elementor 免費版都已更新，並做好備份。
依 2026 年官方文件，安裝方式有兩種：
- 從後台連結帳號（官方建議）：WordPress 後台到「Elementor → Editor → Quick Start」，按 Connect & Activate，登入購買 Pro 的 Elementor 帳號並選擇訂閱，就會自動安裝並啟用 Pro。
- 手動上傳：從 Elementor 帳號頁下載 Elementor Pro 的 zip 檔，到「外掛 → 安裝外掛 → 上傳外掛」上傳並啟用。
手動上傳的話，啟用後還要連結授權：在外掛列表點 Connect & Activate，登入帳號並選擇訂閱。授權連結後才能使用 Pro 小工具並收到自動更新。
步驟二：把 Posts 小工具拖進頁面
用 Elementor 開啟要放文章列表的頁面，在左側小工具面板搜尋「Posts」（繁中介面可能顯示為「文章」，位於 Pro 分類），拖到頁面上的容器中。
步驟三：設定版面（Layout）
加入後預設會列出最新文章。內容分頁的 Layout 區先選外觀（Skin）：
- Classic：傳統的圖片＋標題＋摘要，可設定欄數、每頁篇數、圖片位置、瀑布流（Masonry）、圖片解析度與比例、摘要長度、Meta 資料與「閱讀更多」按鈕。
- Cards：卡片式設計，選項和 Classic 類似，另外有分類徽章（Badge）與作者頭像。
- Full Content：直接顯示文章全文，適合短文或公告。
Meta 資料可以勾選要顯示作者、日期、時間、留言數等。
步驟四：設定要顯示哪些文章（Query）
Query 區的 Source 決定文章來源，可選文章、頁面、自訂文章類型、手動選擇、目前查詢（用在彙整頁範本）或相關文章。選好來源後：
- Include／Exclude：依分類、標籤或作者篩選，例如只顯示「最新消息」分類；也可以排除目前這篇文章，避免在文章頁的相關列表中出現自己。
- Date：只顯示過去一天、一週或自訂期間的文章。
- Order By／Order：依日期、標題、選單順序或隨機排序，再選遞增或遞減。
- Ignore Sticky Posts：是否忽略置頂文章。
步驟五：設定分頁
Pagination 區可以選擇只顯示頁碼、只顯示上一頁／下一頁，或兩者都顯示，也能限制最多顯示幾頁。文章多的部落格頁面建議開啟分頁，避免一次載入太多文章。
步驟六：調整樣式
切到「樣式」分頁，Layout 區可以調整欄距、列距，下方則分別設定卡片背景、圖片、標題、Meta、摘要與「閱讀更多」的字型、顏色與間距。建議先把標題字級與行高調好，列表的閱讀感最受它影響。
步驟七：分別設定手機與平板的欄數
切換到平板或手機預覽（新版在編輯器上方的裝置切換按鈕），再回到 Layout 的 Columns 選單修改數值，例如桌機 3 欄、平板 2 欄、手機 1 欄。帶有裝置圖示的欄位都可以依裝置分別設定。
步驟八：在特定裝置隱藏文章列表
如果某個列表只想在電腦上出現，可以到「進階」分頁的 Responsive（響應式）區，開啟「在手機上隱藏」。隱藏只是不顯示，內容仍會載入，所以不需要的區塊最好直接刪除。
Posts 小工具和 Loop Grid 要選哪一個？
Posts 小工具的卡片結構是固定的，設定快、適合標準的部落格列表。如果想自己設計每張卡片要放哪些欄位（例如 ACF 自訂欄位、價格、標籤按鈕），Elementor Pro 後來推出的 Loop Grid 更有彈性：先設計一張 Loop Item 範本，再套用到每一筆資料。做法可以參考 Elementor Loop Grid 教學。
常見問題
Elementor 免費版有文章列表小工具嗎？
沒有，Posts 與 Loop Grid 都是 Elementor Pro 的小工具；只用免費版的話，可以用 WordPress 內建的「最新文章」或「查詢迴圈」區塊代替。
文章列表可以只顯示某個分類嗎？
可以，在 Query 的 Include 選擇依分類（Term）篩選，再搜尋並加入要顯示的分類即可。
為什麼文章列表的圖片大小不一致？
因為各篇精選圖片的原始比例不同；在 Layout 設定固定的圖片比例（Image Ratio），列表就會裁成一致的高度。
結語
Posts 小工具是 Elementor Pro 最常用的功能之一：選好外觀、設定查詢條件與分頁，就能做出會自動更新的文章列表。先決定「要列哪些文章」，再調整版面與樣式，最後切到平板和手機檢查欄數；需要更自由的卡片設計時，再改用 Loop Grid。