![WooCommerce 商品短代碼教學：用 [products] 顯示商品列表](https://www.design-hu.com.tw/wp-content/uploads/2026/10/xue-cover-woocommerce-shortcode-products.webp "WooCommerce 商品短代碼教學：用 [products] 顯示商品列表 8")
重點整理
WooCommerce 用 [products] 短代碼就能在任何頁面顯示商品列表，加上 limit、columns、orderby、category、on_sale 等屬性，可以控制顯示數量、欄數、排序與篩選條件。舊的 [featured_products]、[sale_products] 等短代碼在 WooCommerce 11.1.2 仍然可以用，但官方文件已改推 [products] 一個短代碼搞定；用區塊編輯器的話，官方更建議直接用 WooCommerce 的商品區塊。
想在促銷活動頁放「熱銷前四名」、在品牌頁只顯示某個分類的商品，或在首頁放最新上架商品，不需要另外裝外掛，WooCommerce 內建的短代碼就能做到。這篇整理常用的商品列表短代碼、[products] 的屬性用法，並附上四個可以直接複製的組合範例。
WooCommerce 商品列表有哪些基本短代碼？
下面這六個是早期常用的商品列表短代碼，貼上就會顯示，在 2026 年的 WooCommerce 仍然有效：
| 短代碼 | 顯示內容 | 改用 [products] 的寫法 |
|---|---|---|
[featured_products] | 標記為精選的商品 | [products visibility="featured"] |
[sale_products] | 有特價的商品 | [products on_sale="true"] |
[best_selling_products] | 銷售量最高的商品 | [products best_selling="true"] |
[recent_products] | 最新上架的商品 | [products orderby="date" order="DESC"] |
[product_attribute] | 符合指定屬性的商品 | [products attribute="color" terms="black"] |
[top_rated_products] | 評分最高的商品 | [products top_rated="true"] |
WooCommerce 官方的 商品短代碼文件 說明，[products] 已經取代上面這些個別短代碼。新寫的頁面建議直接用右欄的寫法，比較好統一維護。
在 Elementor 裡加入短代碼
短代碼可以貼在傳統編輯器、區塊編輯器的「短代碼」區塊，或頁面編輯器的短代碼小工具裡。下面以 Elementor 示範。
步驟一：加入短代碼小工具
在 Elementor 編輯畫面左側搜尋「短代碼」（Shortcode），把小工具拖到頁面上。
步驟二：貼上短代碼
在小工具的欄位貼上短代碼，畫面就會顯示對應的商品。下圖是顯示精選商品的結果。
換成特價商品的短代碼，就會只列出有特價的商品。
[products] 短代碼可以用哪些屬性？
顯示與排序
- limit：顯示幾個商品，
-1代表全部顯示。 - columns：每列顯示幾欄。
- paginate：是否分頁，預設
false，設為true會顯示分頁（搭配limit使用）。 - orderby：排序依據，可用
date（發布日期）、id（商品 ID）、menu_order（自訂順序，數字小的在前）、popularity（銷售量）、rand（隨機）、rating（評分）、title（商品名稱，預設值）。 - order：
ASC遞增或DESC遞減。
篩選商品
- ids：指定商品 ID，多個用逗號分隔。商品 ID 可以在「商品 → 所有商品」把滑鼠移到商品名稱上看到。
- skus：指定商品貨號，多個用逗號分隔。
- category：指定商品分類的代稱（slug），多個用逗號分隔；搭配
cat_operator（IN、NOT IN、AND）可以排除或同時符合多個分類。 - tag：指定商品標籤的代稱。
- attribute 與 terms：指定商品屬性與屬性值，例如顏色是黑色。
- visibility：依商品的目錄可見度篩選，常用
featured（精選商品）。
特殊條件（同一個短代碼只能用一個）
- on_sale：只顯示特價商品。
- best_selling：顯示銷售量最高的商品。
- top_rated：顯示評分最高的商品。
四個 [products] 組合範例
範例一：四個熱門的特價商品
[products limit="4" columns="4" orderby="popularity" on_sale="true"]
範例二：兩欄顯示精選商品
[products limit="4" columns="2" visibility="featured"]
範例三：最新的四個商品（依 ID 由大到小）
[products limit="4" columns="4" orderby="id" order="DESC" visibility="visible"]
範例四：只顯示特定分類的八個商品
[products limit="8" columns="4" category="hoodies, tshirts"]
想顯示的是「商品分類」本身（分類圖片與名稱），而不是分類底下的商品，要改用 [product_categories]，可以參考 WooCommerce 短代碼顯示商品分類教學。
常見問題
[featured_products] 短代碼還能用嗎？
可以，WooCommerce 11.1.2 仍然保留 [featured_products]，貼上就會顯示精選商品。不過官方文件已改推 [products visibility="featured"]，兩者效果相同，後者可以再加上數量、欄數、排序等屬性。
用區塊編輯器還需要 WooCommerce 短代碼嗎？
不一定。WooCommerce 內建「商品集合」等商品區塊，可以用介面選擇分類、特價、排序，不用記屬性名稱，官方也建議優先使用區塊。短代碼適合用在 Elementor 等頁面編輯器、傳統編輯器，或需要在小工具、程式裡插入商品列表的地方。
為什麼貼了短代碼卻沒有顯示任何商品？
先檢查屬性值是否正確：category 要填分類的「代稱」而不是中文名稱；用 visibility="featured" 時要先在商品列表點星號設為精選；on_sale 只會顯示目前有特價的商品。另外，短代碼的引號要用半形英文引號，從網頁複製時常被換成全形或彎引號。
結語
記住 [products] 這一個短代碼，再依需求加上 limit、columns、orderby、category 或 on_sale 等屬性，就能組出大部分的商品列表。舊的個別短代碼仍可使用，但新頁面建議統一改用 [products]；如果網站主要用區塊編輯器，則優先考慮 WooCommerce 的商品區塊。