重點整理
想讓 WooCommerce 顧客按下「加入購物車」後跳出視窗，顯示商品、購物車總額與推薦商品，可以用 YITH WooCommerce Added to Cart Popup 付費版。2026 年 10 月官網售價 59.99 歐元（未稅，含一年更新與支援），最新版 2.43.0 支援 WordPress 7.1 與 WooCommerce 11。原本 WordPress.org 上的免費版已在 2021 年下架，現在只能向 YITH 官網購買。設定分三塊：彈出視窗內容、推薦商品、迷你購物車與排除清單。
WooCommerce 預設按下「加入購物車」後，只會在頁面上方出現一行「已成功加入購物車」的文字，顧客很容易沒注意到，也不知道下一步該去結帳還是繼續逛。加入購物車彈出視窗可以把剛加入的商品、目前購物車金額和推薦商品一次秀出來，同時提供「檢視購物車」與「繼續購物」按鈕，讓購物流程更清楚，也多一次加購的機會。這篇說明 YITH Added to Cart Popup 的各項設定，以及實際在前台的效果。
說明：這是 YITH 官方販售的付費外掛，需要到官網購買後下載安裝。鵠學苑是自行購買使用後撰寫本篇，沒有收取任何分潤，也不為此外掛背書。
YITH Added to Cart Popup 能做什麼？
依 YITH 官方商品頁，主要功能有：
- 顧客加入購物車時跳出視窗，可選擇只顯示剛加入的商品或整個購物車內容
- 視窗內顯示商品縮圖、規格、運費、稅金與購物車總額，以及「檢視購物車」「繼續購物」按鈕
- 在視窗內推薦商品：可手動挑選，或使用相關商品、交叉銷售、追加銷售
- 懸浮的迷你購物車圖示，可分別設定桌機與手機是否顯示
- 用排除清單指定哪些商品或分類不要跳出視窗
購買一次可取得一年的更新與技術支援，官網提供 30 天退款保證。
YITH Added to Cart Popup 設定步驟
以下截圖是較早期的版本，新版後台介面已改成 YITH 的新樣式，但設定項目名稱大致相同。
步驟一：購買並下載外掛
到官方商品頁購買，完成後到 YITH 帳號的下載區取得外掛 zip 檔與授權碼。
步驟二：上傳安裝並進入設定頁
到 WordPress 後台「外掛 → 安裝外掛 → 上傳外掛」，選擇 zip 檔安裝並啟用。完成後左側選單會出現「YITH」，點進去找到 Added to Cart Popup 就是設定頁。
步驟三：設定彈出視窗的基本內容
- Popup Size：彈出視窗的寬高（px），會依螢幕大小自動縮放。
- Enable Popup：要在商品列表頁、單一商品頁的哪一處啟用。
- Select content：顯示購物車內所有商品，或只顯示剛加入的那一件。
- Show product info／thumbnail：是否顯示商品資訊與縮圖。
步驟四：設定金額與按鈕
- Show product variations：顯示商品規格，例如顏色、尺寸。
- Show cart total／shipping fees／tax amount：顯示購物車總額、運費、稅金。
- Show “View Cart” Button／”Continue Shopping” Button：顯示「檢視購物車」「繼續購物」按鈕。
- Enable on mobile：手機上是否也跳出視窗。
步驟五：設定推薦商品
- Show suggested products：在視窗下方顯示推薦商品。
- Number／Columns of suggested products：推薦幾件、排成幾欄。
- Suggested products type：推薦來源，例如相關商品、交叉銷售、追加銷售，或手動挑選。
- Show “Add to cart” Button：推薦商品下方是否顯示加入購物車按鈕。
步驟六：調整外觀樣式
樣式設定大多只要貼上色碼，幾個重點項目：
- Overlay color／opacity：視窗後方遮罩的顏色與透明度。
- Popup background：視窗本身的背景色。
- Message Icon：「已加入購物車」文字前面的圖示，可以從媒體庫選。
步驟七：確認主題的 AJAX 加入購物車設定
有些佈景主題（例如 Astra）有自己的「AJAX 加入購物車」或側邊購物車功能，可能和彈出視窗互相衝突，造成視窗不出現。如果設定完沒有效果，先到主題的自訂選項中，把主題自帶的加入購物車效果關掉再測試。
步驟八：到前台測試效果
設定完成後，到任一商品頁按「加入購物車」。
畫面會跳出彈出視窗，顯示的項目依剛才勾選的設定而定。
迷你購物車與排除清單設定
迷你購物車（Mini Cart）
Mini Cart 是懸浮在網頁上的小購物車圖示，點擊後會跳出和加入購物車時一樣的視窗。可以分別設定桌機與手機是否顯示，以及是否在圖示上顯示購物車商品數量。
也可以設定小購物車在畫面上的位置。
排除特定商品或分類
在 Product Exclusion List 輸入商品名稱並選取，加入清單的商品按加入購物車時就不會跳出視窗，只顯示原本的文字提示。要移除，點 Actions 的 Delete 即可。
Category Exclusion List 則是整個分類都不跳出視窗，設定方式相同。
常見問題
YITH Added to Cart Popup 還有免費版嗎？
沒有，WordPress.org 上的免費版已在 2021 年下架，現在只能向 YITH 官網購買付費版。不想付費的話，可以找其他仍在維護的免費「加入購物車彈出視窗」外掛，安裝前先確認最近更新日期與支援的 WooCommerce 版本。
設定好了，按加入購物車卻沒有跳出視窗？
最常見的原因是主題自帶的 AJAX 加入購物車或側邊購物車功能和外掛衝突。先在主題設定關掉這類功能，再清除快取外掛的快取後測試；也確認該商品或分類沒有被加進排除清單。
WooCommerce 預設的「加入購物車」可以改成直接跳到購物車頁嗎？
可以，在 WooCommerce「設定 → 商品」勾選「成功加入購物車後，重新導向至購物車頁面」即可，不需要外掛。但這樣顧客每加一件就會離開商品頁，比較適合單品購買為主的商店。
結語
加入購物車彈出視窗能讓顧客清楚知道「已經加入了」，並順勢看到總金額與推薦商品，是提高客單價的小技巧。YITH Added to Cart Popup 目前只有付費版，設定以勾選為主，重點在決定視窗要顯示哪些資訊、推薦哪些商品，最後記得到前台實測，並確認主題沒有衝突。