多數人以為裝一支免費外掛，能用的工具頂多幾個基本款，剩下的都得掏錢才拿得到。打開 Elementor 的元件面板，畫面卻完全不是這麼一回事。免費版就排了三十幾個小工具，標題、圖片、按鈕、輪播、頁籤、手風琴通通有，一路往下捲都捲不完；裝上 Pro 之後，這面工具牆再暴增將近九十個，從表單、彈窗到電商專用元件全部塞進來。
這麼多小工具擠在同一個面板，反而是多數人卡關的地方。問題不是工具不夠用，而是根本不知道哪個工具該用在哪裡，結果實際常用的可能還不到十分之一，其餘的每次要用都要重新摸索一次才知道功能是什麼。Elementor 小工具（widget）其實就是拖進頁面裡的一個個內容積木，每一個負責一種具體用途，從放一段文字到嵌一張地圖都算。
這篇把免費版和 Pro 版常用的小工具分類盤點一次，一組一組講清楚各自拿來做什麼、什麼場景會用到，看完就能對照自己的網站需求，知道哪些工具現在就用得上、哪些先擱著也沒關係。先從免費版和 Pro 版的數量差距講起，再往下一組一組拆。
免費版和 Pro 版，小工具數量有什麼差異？
Elementor 官方公布免費版含超過 40 個免費小工具，元件面板上目前可以數到的核心項目約三十多個，官方也特別註明數量還在持續增加。裝上 Elementor Pro 之後，另外解鎖一批進階元件與工具，但不是買了 Pro 就一次全部拿到。入門的 Essential 方案只含 57 個 Pro 元件，得往上升級到涵蓋電商功能的 Advanced 以上方案，才會解鎖到全部 85 個。
換句話說，免費版跟 Pro 版的差距不是「功能好壞」，是「數量與範圍」。免費版負責把一個頁面的基本內容排好，Pro 版則多出一整批用來做電子報訂閱、彈出視窗、電商頁面、跨頁自動套用版型的專用元件。不管是哪一種，找工具最快的方法都一樣，直接在編輯器左側面板的搜尋框打工具名稱，不用死記每個小工具收在哪一類底下。
文字與見證類小工具：把內容和信任感一次補齊
放文字內容跟建立信任感，是幾乎每個頁面都少不了的兩件事，這組小工具就是負責這兩塊。
標題（Heading）負責頁面上的大標與小標，可以直接指定要輸出的 HTML 標籤層級，從 H1 到 H6 或純段落都能選，適合當一個區塊的視覺主標。文字編輯器（Text Editor）則用來放內文段落，操作介面接近 WordPress 內建的文字編輯器，適合寫產品說明、服務介紹這類篇幅較長的文字。
客戶見證（Testimonials）專門用來呈現顧客評價或推薦語，一次擺入頭像、姓名、職稱與評語，比自己用文字元件硬排要快得多，很適合放在首頁或服務頁做社會證明的段落。
圖片與影音類小工具：視覺素材怎麼放進頁面？
這組收放圖片、影片、地圖跟音訊這類視覺與媒體素材的免費元件，依「單張」到「多張」再到「非圖片媒體」的順序介紹。
圖片（Image）是放單張圖片最基本的元件，可以調整尺寸、透明度、圓角、濾鏡等樣式，也能直接替圖片加上連結。圖片方塊（Image Box）把圖片、標題、說明文字三合一組成一個元件，適合排「服務項目」「產品特色」這種一格一格的介紹版面，比分開放三個元件要省事許多。
要一次展示大量圖片，用圖庫（Image Gallery）把多張圖片排成網格，很適合作品集或活動花絮這類頁面；比較在意版面空間，就改用圖片輪播（Image Carousel），讓多張圖片以左右滑動的方式呈現，常見於首頁主視覺或客戶標誌牆。
影片（Video）可以嵌入 YouTube、Vimeo、VideoPress、Dailymotion 或自行上傳的影片檔，並設定自動播放、循環播放、靜音這類播放行為。地圖（Google Maps）用來嵌入地圖並標出地點，適合門市、店面、活動場地頁面；SoundCloud 則用來嵌入音訊內容，適合 Podcast 節目介紹頁或音樂類網站。這幾個元件的共同之處，是把外部服務的內容直接嵌進頁面，不用另外寫嵌入碼。
按鈕與圖示類小工具：導引訪客往下一步
點擊行為和品牌識別，靠的多半是這一組元件。
按鈕（Button）是最常用的行動呼籲元件，可以設定文字、連結、圖示、尺寸與樣式，幾乎每個轉換頁面都少不了它。想做一頁彙整多個外部連結（社群帳號、線上商店、預約頁等），可以用連結頁（Link in Bio），適合放在個人品牌或社群導流頁，不用另外申請第三方連結頁服務。
圖示（Icon）可以從內建圖示庫挑一個放上頁面，官方目前收錄超過 1,500 個免費圖示，也能上傳自訂 SVG 圖示，常拿來搭配文字強化視覺辨識度。圖示方塊（Icon Box）跟圖片方塊功能類似，差別是主視覺換成圖示而非照片，適合排「服務流程」「產品優勢」這類比較抽象的介紹格。列服務項目、方案內容、檢核清單這種需要條列的內容，就用圖示清單（Icon List），把清單項目前面的圓點換成任意圖示。社群圖示（Social Icons）能一次擺放多個社群平台圖示並各自連到對應頁面，通常放在頁尾或關於頁。
頁籤和手風琴，長內容怎麼收得整齊？
內容一多，版面就容易變得又長又雜，這組元件的共同目的就是把大量資訊收進較小的空間、需要時才展開。
巢狀分頁（Nested Tabs）把內容拆成多個頁籤，訪客點哪個頁籤才顯示對應內容，適合把「常見問題」「產品規格」「服務項目」這類並列但各自獨立的內容收進同一區塊；「巢狀」代表頁籤裡還能再放其他小工具，甚至再放一組頁籤。巢狀手風琴（Nested Accordion）的用途類似，差別是內容以上下堆疊、逐項展開收合的方式呈現，比較適合手機版閱讀，常拿來做常見問題區塊。
需要標出一段訪客特別要注意的訊息，例如活動即將截止或庫存有限，可以用提示訊息（Alert），用有顏色的提示框呈現，比純文字更容易被看到。
計數器、進度條與評分：讓數字和成效被看見
這組元件的共同目的，是用視覺化方式呈現量化資訊，而不是只堆一段文字說明。
計數器（Counter）讓數字隨著頁面捲動從 0 逐漸跳到設定的終值，適合呈現服務年資、完成案例數、客戶數這類想強調規模感的數字。進度條（Progress Bar）以長條圖的方式呈現百分比，適合表達技能熟悉度、專案完成度、募資達成率這類「進行到哪裡」的資訊。評分（Rating）則用星星或其他圖示顯示評分結果，適合放在產品介紹或服務評價旁邊，快速傳達多數人怎麼評價。
版面與導覽類小工具：處理留白和頁內細節
剩下這幾個看起來不起眼，卻是排版時幾乎都會用到的輔助元件，依用途分四小組來看。
分隔線（Divider）在兩個區塊之間畫一條線，可調整粗細、樣式與顏色做視覺區隔；間隔（Spacer）則是留一段空白高度，兩者都是控制版面呼吸感的基礎工具。想在頁面某個位置埋一個定位點，讓導覽選單或按鈕可以直接跳到那個位置，就要用選單錨點（Menu Anchor），常見於單頁式網站的內部導覽。
側邊欄（Sidebar）用來把 WordPress 佈景主題原本的側邊欄小工具區塊嵌進 Elementor 排版的頁面裡；繼續閱讀（Read More）則是用來設定彙整頁（如部落格列表頁）文章摘要要在哪裡截斷、顯示閱讀更多按鈕。
最後三個屬於比較技術取向的元件：HTML 元件可以直接貼一段程式碼進頁面，給需要嵌入第三方服務或客製標籤的情境用；簡碼（Shortcode）元件用來放其他外掛提供的簡碼，例如某些表單外掛或會員外掛的嵌入碼；文字路徑（Text Path）則讓一段文字依照自訂的曲線路徑排列，做出弧形或波浪形的文字效果，偏視覺裝飾用途。
Elementor 4.x 新增的基本元素：Div 區塊與 Flexbox
Elementor 4.x 的原子編輯器另外引入一組更底層的版面建構元素，跟前面介紹的傳統小工具不是同一套系統，目前有七個：Div 區塊（Div Block）、Flexbox、標題（Heading）、段落（Paragraph）、圖片（Image）、按鈕（Button）與 SVG。
傳統小工具是功能完整的成品元件，像圖庫、輪播打開就能直接用；這批原子元素則更像精簡的建構積木，每個元素只用一層 HTML 包裹，不像舊版每個元件都疊好幾層結構，載入速度和程式碼乾淨度都更好。Div 區塊是通用容器，可以放任何其他元素，包括再放一個 Div 區塊；Flexbox 則是基於 CSS Flexbox 的排版容器，功能上接近舊版的容器（Container），只是效能更好。這批元素目前仍在持續擴充，官方也公告後續會再加入更多，並非最終定案的清單。
Pro 頁面架構類小工具：讓版型自動套用到每一篇文章
裝上 Pro 之後，第一批多出來的元件屬於主題建構器（Theme Builder）專用，共同特色是直接抓資料庫裡的資料自動顯示，不需要每頁手動輸入內容。版型只要設計一次，套用到全站的文章與頁面就會自動帶入各自的資料。
文章資訊類元件包括 Post Title、Post Excerpt、Post Content、Featured Image、Author Box、Post Comments、Post Navigation、Post Info，各自對應文章頁面上的一塊資訊：文章標題、摘要、內文、特色圖片、作者介紹框、留言區，以及上一篇下一篇導覽連結和作者、日期、分類這類文章資訊列。這批元件放進「單篇文章」範本後，套用到每一篇文章都會自動抓對應內容，不必逐篇手動輸入。
網站結構類元件則包括 Site Logo、Site Title、Page Title、Search Bar、Breadcrumbs、Sitemap 與 Loop Grid，各自對應網站整體結構：網站標誌、網站名稱、當前頁面標題、搜尋框、階層式導覽路徑（麵包屑）、網站地圖，以及用來設計文章列表卡片外觀、套用到整批彙整頁的 Loop Grid，這也是主題建構器系列裡持續強化的重點功能之一。
Pro 行銷與內容呈現類小工具：做出更有轉換力的頁面
這一批是 Pro 版數量最多、涵蓋面也最廣的一組，依用途拆成幾個重點小組來看。
表單（Form）可以自訂欄位類型（文字、Email、下拉選單、核取方塊、檔案上傳等）與送出後動作（寄送 Email 通知、導向感謝頁、串接第三方服務），聯絡表單、報名表單、詢價表單都能用它做，不需要另外裝表單外掛。Posts 用來顯示部落格文章或自訂文章類型的列表，可切換格狀、卡片等多種版面；Portfolio 則是專門設計給作品集、案例展示用的篩選式網格，適合設計、攝影、行銷代理商這類需要展示作品的網站。
輪播型的元件有好幾個變化款：Slides 做整頁式圖文輪播，常用在首頁主視覺；Media Carousel 輪播圖片或影片素材；Testimonial Carousel 專門輪播客戶推薦語；Nested Carousel 可以在輪播裡放任意其他元件組合；Loop Carousel 則是把 Loop Builder 設計好的卡片版型以輪播方式呈現，適合展示文章或商品列表。
Call to Action 整合標題、說明文字與按鈕，用來推廣單一行動，例如立即諮詢；Flip Box 是滑鼠移過去會翻轉、顯示背面另一組內容的互動方塊，適合用有限版面呈現兩層資訊。要呈現價目資訊，Price Table 用來做完整的方案比較卡片，含價格、功能清單、選購按鈕，常見於訂閱制服務或課程方案頁；Price List 則較簡單，是項目對價格的條列呈現，適合餐廳菜單或服務收費表這種不需要比較卡片、只需條列價目的情境。這裡要提醒一下，Elementor 本身沒有通用的資料表格元件，Price Table 與 Price List 是它拿來呈現表格化資訊最接近的選項，需要更複雜的比較表格得另外安裝第三方表格外掛。
長文章可以用 Table of Contents 依標題結構自動產生目錄，並設定跟著捲動的浮動樣式，方便讀者跳讀；Animated Headline 則讓標題文字的其中一部分以打字、輪替、強調等動畫效果呈現，強化標題的視覺記憶點。Countdown 用來做倒數計時，營造活動或優惠即將截止的急迫感；Reviews 用來呈現顧客評論與評等；Share Buttons 讓訪客一鍵把頁面分享到社群平台。
除了以上重點元件，Pro 還有引言區塊（Blockquote）、登入表單（Login）、自訂導覽選單（Nav Menu）、多欄式選單（Mega Menu）、側滑選單或資訊面板（Off Canvas）、Lottie 動畫、程式碼語法標色（Code Highlight）、影片播放清單（Video Playlist）、可另存重複使用的範本（Template），還有一組 Facebook 相關元件（粉專、留言、分享按鈕、貼文嵌入）以及 PayPal、Stripe 付款按鈕。這些屬於比較小眾或特定情境才會用到的元件，用得到時直接在編輯器面板搜尋名稱就能找到，這裡先點名列出，讓讀者知道有這些選項存在。
WooCommerce 電商類小工具，開店網站才用得到
這批元件屬於 WooCommerce Builder 專用，前提是網站已經先安裝 WooCommerce 這套電商外掛。沒有要做線上商店的網站不會用到，也不會在面板上看到這批元件。
依購物流程可以分三組來看：商品頁類元件負責組出一個完整商品頁，包括商品標題、圖片、價格、加入購物車按鈕、評分、庫存狀態、商品說明、商品資訊分頁、相關商品與加購推薦等；商店與分類頁類元件負責列表呈現，包括商品列表、商品分類、WooCommerce 頁面模板、購物用的麵包屑；購物流程類元件則負責走完下單流程，包括購物車圖示、購物車頁、結帳頁、我的帳戶頁、訂單摘要與系統通知訊息。這批元件實際怎麼組出一個商品頁，會是另一個電商主題要細講的內容，這裡先做盤點，知道有哪些選項可用就好。
面對這麼多小工具，其實不需要每個都學。先看自己的網站在做什麼：單頁形象網站或部落格，靠免費版的文字、圖片、按鈕、頁籤這批基礎元件通常就能排完；有多個頁面需要統一版型、要做電子報訂閱、彈窗行銷或線上開店，才會陸續用到 Pro 版的頁面架構、行銷或電商元件。真的想不起來某個工具收在哪一類，直接打開編輯器左側面板用關鍵字搜尋，比翻分類找快得多。