WooCommerce 型錄模式教學：隱藏價格與購物車按鈕

你是不是也遇過這種兩難：商品早就上架、照片也拍好了，卻因為「價格不能公開」「要先報價才能買」「只給登入的盤客看」這類理由，遲遲不敢把購物車按鈕放出來？很多人乾脆把整個 WooCommerce 商店關掉，改用一個靜態頁面把商品一個一個列出來。這太可惜了。

WooCommerce 本身就是一座現成的商品資料庫、分類系統、搜尋與篩選架構，你只要把「價格」和「加入購物車」這兩個動作關掉，它立刻從一座電商賣場變成一座專業的展示型型錄。這篇文章會帶你走完三條路線：用一段程式碼、用一套專用外掛、或是用條件式規則把商店切成「零售下單」與「型錄詢價」兩種模式，連同 SEO 影響、速度優化、上線前檢查清單一次講清楚。

先說結論：「要不要做」這件事其實不用糾結，真正該花腦筋的是「用哪種方式做」。型錄模式背後的商業邏輯，不論是隱藏敏感價格、引導詢價、還是分層報價，對很多產業都是剛需。差別只在你願意花心思用程式碼精準控制，還是用外掛在後台快速搞定。兩種做法接下來都會手把手示範，你挑適合自己技術底子的那一條就行。如果你完全不想碰技術，直接跳到外掛那段跟著設定；如果你偏好乾淨可控、不依賴第三方，程式碼路線會更對你的胃口。

為什麼要把 WooCommerce 商店變成型錄模式？

型錄模式（Catalog Mode）換句話說，就是一件事：讓訪客能看商品、能瀏覽、能搜尋，但不能直接在網站上結帳。這不是委曲求全的妥協，對很多產業來說，它反而是更健康的商業模式。接著把最常見的三種情境列出來，你看看自己落在哪一種。

情境一：批發與 B2B，價格因客戶而異

同樣一箱原料，盤商、經銷商、終端品牌拿到的報價完全不同。把單一價格公開在網站上，等於自找麻煩，不是把大客戶嚇跑（覺得貴），就是被小客戶拿來砍價（覺得你賺太多）。這類網站需要的是「登入才看得到價格、未登入只看得到商品」的雙層結構。

情境二：客製報價，價格根本寫不死

系統櫃、室內設計、工業設備、大型機具、訂製禮品，這類商品的價格是「看規格、看數量、看工期」算出來的。你硬塞一個固定金額在商品頁，反而誤導客戶。把網站當型錄用，引導訪客留下需求規格再報價，成交率會比放一個嚇人的高價好太多。

情境三：市場策略，價格暫時不能露

新品上市前先做預熱、跨區經銷怕觸犯最低廣告價格協議（MAP）、或是單純想把流量導回 LINE 與實體門市。這些情境下，商品頁的任務不是「賣東西」，而是「建立品牌印象、收集名單」。

型錄模式可能提高詢價的相關性，也可能因多一道聯絡步驟而降低轉換。上線後應比較詢價完成率、有效商機率與成交週期，不能預設關掉購物車就會增加詢價或成交。

反過來說，什麼情況不要用型錄模式

這裡也得誠實提醒你，型錄模式不是萬靈丹。如果你的商品就是標準化的零售品、價格透明、庫存充足、客戶期望當下下單當下出貨，硬把購物車關掉只會把已經準備好掏錢的人趕走。衝動消費型的商品（零食、服飾配件、3C 周邊）尤其如此，多一個「先詢價」的步驟，轉換率往往不升反降。

判斷的標準很簡單：你的客戶在下單前，需不需要「人」介入？需要（要報價、要確認規格、要談條件），型錄模式就是助力；不需要（看了規格就能自己決定），型錄模式就是阻力。把這句話記下來，比記任何外掛設定都管用。

型錄模式到底「關掉」了什麼：拆解 WooCommerce 的範本與勾點

要正確做型錄模式，你得先搞懂 WooCommerce 是怎麼把商品頁「組」出來的。它不是一個寫死的頁面，而是一連串範本片段（template parts）掛在勾點（action / filter hooks）上，像積木一樣疊起來。價格、購物車按鈕、數量欄位，每一塊都是獨立的積木。

這對你意味著一件好事：你不用改 WooCommerce 的核心檔案，只要把對應的積木「拆掉」或「改寫」就好。核心不動，將來 WooCommerce 升級也不會把你的修改覆蓋掉。

跟型錄模式直接相關的幾個關鍵積木，對照如下：

頁面區域	負責的範本函式	掛在哪個勾點	關掉的效果
單品頁價格	woocommerce_template_single_price	woocommerce_single_product_summary（優先序 10）	單品頁不再顯示金額
列表頁價格	woocommerce_template_loop_price	woocommerce_after_shop_loop_item_title（優先序 10）	商品分類、搜尋結果頁不顯示金額
單品頁加入購物車	woocommerce_template_single_add_to_cart	woocommerce_single_product_summary（優先序 30）	單品頁沒有下單按鈕
列表頁加入購物車	woocommerce_template_loop_add_to_cart	woocommerce_after_shop_loop_item（優先序 10）	分類頁、推薦區塊沒有快速加入按鈕
價格字串過濾	（無範本，靠 filter）	woocommerce_get_price_html	可把價格替換成「來電詢價」等文字

看懂這張表，你就掌握了型錄模式的全貌。後面不管是寫程式碼、用外掛、還是設條件規則，本質上都是在操作這幾個勾點。差別只在於「你親手操作」還是「讓外掛幫你操作」。

這裡還有一個容易漏掉的細節：商品頁和列表頁處理完之後，側邊欄的小購物車區塊（mini-cart widget）和商品推薦區塊可能還殘留「加入購物車」字樣或價格。這些區塊走的勾點和主範本不同，得獨立處理。最保險的做法是改完之後，從首頁、分類頁、單品頁、到購物車頁，每一種頁面類型都點開用肉眼掃一遍，確認沒有漏網之魚。

三條實作路線：CSS、functions.php、專用外掛的取捨

實作型錄模式，市面上常聽到的做法不脫這三條路。它們各有代價，沒有哪一條是絕對正確，只有「適合你現在的技術能力與維護成本」這件事。

路線	做法	優點	風險與代價
CSS 隱藏	用 display:none 把價格、按鈕藏起來	最快、零程式、即看即得	價格仍在原始碼裡，競品一鍵就能爬走；對 SEO 結構化資料毫無幫助；佈景主題一換可能失效
functions.php 程式碼	用 remove_action 與 add_filter 拆勾點	乾淨、從根本移除、可精準條件控制、不增加外掛負擔	要懂一點 PHP 與勾點概念；改錯可能讓商品頁白屏
專用外掛	裝一套 Catalog Mode 外掛用後台設定	免寫程式、有完整後台介面、通常附詢價表單整合	多一份依賴與更新負擔、進階功能常要付費、外掛衝突風險

這裡要特別打臉一個常見的偷懶做法：用 CSS 把價格藏掉。很多人以為「畫面看不到」就等於「沒有價格」，這是大錯特錯。瀏覽器開「檢視原始碼」，金額一行一行清清楚楚躺在那裡，你的定價策略對競品完全透明。更糟的是，Google 抓取你的商品頁時讀的也是原始碼，Product Schema 裡的 price 欄位照樣送出去，等於你對搜尋引擎公開了價格，卻對真人訪客隱藏。這種「自欺欺人」的型錄模式，不建議採用。

下面會把後兩條路（程式碼、外掛）展開介紹。CSS 那條，留給「臨時上線、三天內補正式方案」的過渡期就好。

給你一個快速決策的判斷點：如果你只「全站統一關閉、不分辨客戶」，程式碼路線最划算，十行 remove_action 就搞定，沒有後續維護負擔。如果你需要「分客戶、分分類、分時段」顯示不同內容，規則一超過三條，自己寫程式碼的維護成本就會反過來壓過外掛的授權費，這時直接上外掛反而省心。團隊裡沒有人碰程式碼、或是網站交給非技術人員維運，外掛路線幾乎是唯一選項，因為它把所有邏輯包進後台介面，離職交接時不用連一段 PHP 一起交接。

路線一：用 functions.php 程式碼片段，零外掛關閉價格與購物車

這是實務上最推薦的路線，前提是你願意碰一點程式碼。它的好處是從勾點層移除，價格連 HTML 都不會輸出，乾淨俐落。操作前請先做兩件事：裝好完整的 WordPress 備份，並且確認你編輯的是子佈景主題（child theme）的 functions.php，而不是主佈景主題的檔案（主題一更新就會被覆蓋）。如果你還沒有子佈景主題，先花十分鐘處理佈景主題安裝與子主題這一步，往後所有客製都會受用。

關閉全站價格與購物車按鈕

把這段貼進子佈景主題的 functions.php 最底部：

// 移除單品頁的價格與加入購物車
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 10 );
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );

// 移除商品列表頁（分類、搜尋、推薦）的價格與加入購物車
remove_action( 'woocommerce_after_shop_loop_item_title', 'woocommerce_template_loop_price', 10 );
remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart', 10 );

存檔、清快取、重新整理商品頁。你會看到價格與「加入購物車」按鈕同時消失，商品標題、照片、描述都還在。這就是一座最原始的型錄頁。

用過濾器把價格替換成詢價文字

單純「移除」有時太乾淨了，商品頁會留下一塊突兀的空白。更細緻的做法是用 woocommerce_get_price_html 這個過濾器，把原本的價格字串換成一句引導文字：

add_filter( 'woocommerce_get_price_html', function( $price, $product ) {
    return '<span class="catalog-inquiry">歡迎來電詢價</span>';
}, 10, 2 );

這個做法的好處是價格欄位還在版面上、視覺不破，只是內容換掉了。訪客的目光會自然落在這句話上，引導效果比一片空白好得多。

這裡有個小提醒：有些佈景主題或快取外掛會把商品頁 HTML 整頁快取下來，你改完程式碼後若畫面沒變，記得手動清一次快取。如果你對快取機制還不熟，WordPress 快取外掛的運作原理這篇值得先讀過一遍，能少踩很多「我明明改了為什麼沒生效」的坑。

改錯了怎麼辦：白屏的應急處理

functions.php 是 WordPress 裡最容易「一個分號打錯、整站白屏」的檔案。萬一你貼完程式碼、存檔之後網站整個掛掉，先別慌。兩條應急路線：第一，透過 FTP 或主機檔案管理員（cPanel 的 File Manager、Cloudways 的 SSH、或你主機商提供的介面）連到伺服器，把剛貼進去的那幾行刪掉、存檔，網站立刻恢復。第二，如果你裝的是程式碼片段管理外掛（像是 Code Snippets），它通常有「安全模式」，可以在不啟用問題片段的情況下讓網站先回復，再回去修改。

回過頭，前面強調過的備份與子佈景主題兩件事，這裡再串一次。子佈景主題出錯，大不了把它的 functions.php 清空，主佈景主題與 WooCommerce 核心完全不動，網站馬上能回來。直接改主佈景主題的話，下一次主題更新會把你的修改覆蓋掉，等於白做；出錯時也更難隔離問題。把這個習慣養起來，你之後所有 WordPress 客製都會安全很多。

路線二：YITH WooCommerce Catalog Mode 外掛的完整設定流程

不想碰程式碼、或是你的型錄需求比較複雜（例如要附詢價表單、要排除某些分類、要排程上下架），那專用外掛是更務實的選擇。在眾多 Catalog Mode 外掛裡，YITH WooCommerce Catalog Mode 是歷史最久、文件最完整、也最常被拿來當標竿的一套。它同時在 WordPress 官方外掛庫提供免費版本，免費版就能完成基本的「隱藏價格、隱藏購物車、顯示替代按鈕」。

安裝與基本設定四步

1. 安裝：後台「外掛 → 安裝外掛」搜尋 YITH WooCommerce Catalog Mode，點安裝並啟用。進階功能（條件規則、表單整合、排程）需要安裝官方的 Premium 版本。
2. 開啟型錄模式：到「YITH → Catalog Mode」設定頁，把主開關打開。這一步會全站關閉購物車與價格。
3. 選擇替代內容：在「Alternative button」區塊，你可以設定一個按鈕取代原本的「加入購物車」。按鈕可以是純文字連結（導到聯絡頁）、可以嵌入 Contact Form 7 短碼、也可以是一段自訂 HTML。
4. 設定例外：在「Exclusion」分頁勾選「哪些分類、哪些商品、哪些使用者角色不要套用型錄模式」。這個功能是外掛相對於程式碼的最大價值，下面會專門講。

什麼時候該為外掛付費

免費版能滿足「全站關掉購物車」的純展示需求。但下列這些情境，你會需要付費版：

• 條件式型錄：要針對未登入訪客、特定使用者角色、特定分類做不同的顯示邏輯。
• 內建詢價表單：不想再額外裝表單外掛，希望直接在商品頁插入一個「詢問此商品」的表單。
• 排程：例如週年慶前兩週先關掉購物車做預熱、活動當天再開回來。
• 隱藏售價但保留變化商品選項：對顏色、尺寸、規格仍可選，只是不顯示金額。

外掛路線的代價很實際：多一份外掛依賴、多一筆年度授權費、多一個與其他外掛衝突的變數。但對沒有開發資源的團隊來說，這是唯一能在後台點一點就完成複雜條件的方式。取捨很清楚：要省錢、要乾淨，走程式碼；要省事、要彈性，走外掛。

外掛設定的三個常見誤區

用 YITH 這類外掛，設定本身不難，但有三個最常見的誤區。第一，只關了單品頁、漏了列表頁。外掛的設定面板通常把「商品頁」「分類頁」「搜尋頁」分成不同開關，很多人以為打開主開關就全包了，結果分類頁的價格還在。第二，詢價按鈕的連結忘了換。外掛預設的替代按鈕常指向一個 demo 頁或空白連結，你不主動改成自己的聯絡頁或 LINE 帳號，等於擺了個裝飾品。第三，啟用後沒測變化商品。有規格選項的商品在型錄模式下，價格關閉後規格下拉選單偶爾會失效，這是外掛與佈景主題互動的雷區，務必逐一測試。

這三個誤區的共同點是「設定完就以為結束了」。外掛的好處是把流程簡化成後台點選，壞處是它給你一種「一切都在掌控中」的錯覺。真實的驗收方式永遠是：把自己當成一個第一次來的訪客，從搜尋引擎點進來，走完分類、單品、詢價的完整流程，看到什麼就記下什麼，比對著設定面板回頭修正。

條件式型錄：只對批發客、未登入者或特定分類隱藏價格

全站統一關閉價格是最簡單的型錄模式，但真實世界的需求很少這麼「一刀切」。更常見的是混合模式：零售商品照常下單，只有特定分類走詢價；或是未登入者看型錄、登入的盤客看得到批發價。這就是條件式型錄派上場的地方。

用使用者角色切換：盤客看得到，零售客看不到

做法的核心是判斷「目前訪客是誰」，再決定要不要顯示價格。WooCommerce 與 WordPress 內建的角色系統就是最天然的判斷依據。先在 WordPress 建好「批發客」這個自訂角色（如果你對角色權限還不熟，WordPress 使用者權限的完整設定邏輯這篇能幫你快速上手），然後在價格過濾器裡加上判斷：

add_filter( 'woocommerce_get_price_html', function( $price, $product ) {
    // 只有「批發客」角色看得到價格
    $user = wp_get_current_user();
    if ( ! in_array( 'wholesale_customer', (array) $user->roles, true ) ) {
        return '<a href="#詢價表單" class="btn-inquiry">登入看批發價</a>';
    }
    return $price;
}, 10, 2 );

這段程式碼的效果：一般訪客看到的是一個「登入看批發價」的按鈕，引導他們註冊或登入；通過批發客角色驗證的人，則照常看到價格並能下單。這就是 B2B 批發站最經典的雙層結構。

用分類切換：某些商品走詢價，某些照常賣

另一種常見需求是「同一家店同時賣現貨與訂製品」。現貨商品照常顯示價格與購物車，訂製類商品則關閉下單、改走詢價。判斷依據換成分類即可：

add_action( 'woocommerce_single_product_summary', function() {
    global $product;
    // 指定分類的商品，移除加入購物車
    if ( has_term( 'custom-made', 'product_cat', $product->get_id() ) ) {
        remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );
        echo '<a href="#索取報價" class="button">索取報價</a>';
    }
}, 29 );

把 custom-made 換成你實際的分類代稱，這段就會只對該分類的商品生效。這類條件邏輯用程式碼寫很靈活，但當規則一多（三個分類、兩種角色、加上時間排程），維護成本就會快速攀升，這時就是該回頭考慮 YITH 付費版那種後台介面的時機了。

用庫存狀態切換：缺貨商品轉詢價

還有一種很實用的條件：商品有庫存時正常販售，缺貨時自動轉成詢價模式，引導客戶留下需求等下一批到貨通知。WooCommerce 內建就有庫存狀態的屬性，判斷起來很直接：

add_filter( 'woocommerce_get_price_html', function( $price, $product ) {
    if ( ! $product->is_in_stock() ) {
        return '<a href="#到貨通知" class="btn-inquiry">缺貨中，通知我</a>';
    }
    return $price;
}, 10, 2 );

這個做法讓缺貨頁多一個收集到貨需求的入口。是否比重新投放廣告有效，要看商品需求、通知送達與補貨速度；至少應追蹤登記率、通知開啟與補貨後成交，避免只累積無法使用的名單。

把「加入購物車」換成「詢價按鈕」的兩種串接方式

關掉購物車只是消極的一步，真正讓型錄頁產生商業價值的，是你用什麼東西取代它。一個乾淨的詢價按鈕，能把「看一下就走」的訪客，變成「留下需求規格」的潛在客戶。接下來把最實用的兩種串接方式拆解。

方式一：嵌入聯絡表單

最直接的做法，是在商品頁原本人們按「加入購物車」的位置，插入一張詢價表單。WordPress 生態裡能做這件事的外掛很多，你可以挑一套順手的表單外掛來用。如果你是 Elementor 使用者，直接用Elementor Pro 的表單元件最省事，視覺與商品頁無縫整合。

串接的關鍵是「讓表單知道這是哪一個商品的詢問」。做法很簡單：在表單裡加一個隱藏欄位，用網址參數或 PHP 把商品名稱、SKU 帶進去。這樣你收到詢價單時，一眼就知道對方問的是哪件商品，回信效率會高很多。如果不喜歡在商品頁塞一整張表單（視覺太重），也可以只放一個按鈕，點下去跳到一個共用的詢價頁，按鈕帶著商品資訊一起過去。

方式二：導到 LINE 官方帳號

對台灣市場來說，LINE 往往比電子郵件表單更有效率。訪客點按鈕直接跳到你的 LINE 官方帳號，帶著一段預寫好的訊息（例如「我想詢問《商品名》的報價」），對話立刻展開。如果你已經在用 LINE 做訂單通知（像是WooCommerce 訂單的 LINE 推播設定），把詢價入口也接到同一個官方帳號，後續把詢價客戶導向下單流程會更順。

這兩種方式不衝突，很多人會同時用：商品頁放表單按鈕給習慣填單的客戶，頁尾或浮動區塊放 LINE 按鈕給習慣即時對話的客戶。重點是不要讓訪客在商品頁上找不到任何「下一步」，否則型錄模式就只是把訂單擋掉而已，毫無商業意義。

追蹤詢價轉換，才知道型錄模式有沒有奏效

型錄頁上線之後，最關鍵的一件事是追蹤詢價轉換。很多人改完商品頁就收工，卻從來不知道「詢價按鈕到底被點了幾次」「填單完成率多少」「LINE 跳轉後有沒有真的留下訊息」。沒有這些數字，你根本無從判斷型錄模式是帶來生意、還是只是把人擋在門外。

至少可埋三個追蹤點：詢價按鈕點擊、表單送出成功，以及 LINE 按鈕跳轉。這些動作可在 Google Analytics 4 設成事件，重要者再標記為關鍵事件。感謝頁只能記錄到達該頁的工作階段，若網址可被重複開啟或分享，不能視為每次都代表新的詢價；最好搭配表單端紀錄或後端事件核對。

型錄模式對 SEO 與結構化資料的真實影響

這是很多人做型錄模式時最忽略、卻也最重要的一塊。你關掉的不只是畫面上的價格，還連帶影響搜尋引擎怎麼理解你的商品頁。WooCommerce 預設會在商品頁輸出 Product Schema（結構化資料），裡面包含 price、availability、offers 這些欄位。Google 抓到這些資料，就有機會在搜尋結果裡秀出價格、庫存狀態這類「豐富結果（rich result）」。

問題來了：當你把畫面價格關掉，Schema 裡的 price 還在嗎？

實作路線	畫面價格	原始碼價格	Schema price 欄位	Google 看到的
CSS 隱藏	看不到	還在	還在	價格照樣公開
remove_action 移除	看不到	不在	可能還在（視佈景而定）	視情況，需驗證
woocommerce_get_price_html 過濾	換成文字	文字	可能還在	視情況，需驗證
外掛完整關閉	看不到	依外掛實作	依外掛與設定	必須實測

這張表告訴你一件殘酷的事：你以為「關掉價格」了，搜尋引擎未必這麼認為。最務實的做法是改完之後，用 Google 的「複合式搜尋結果測試」或 Search Console 實際檢查你的商品頁，確認 price 欄位的確消失了，或是被你換成了正確的內容。如果你對結構化資料還不熟，結構化資料 Schema 標記的完整教學這篇從原理到實作都講得很細，做完型錄改造務必對照著檢查一遍。

這裡有一點要特別提醒：失去「價格豐富結果」這個版面，點擊率（CTR）短期可能會受影響，因為搜尋結果少了那個醒目的金額。但對 B2B、客製報價這類本來就不該在搜尋結果露價格的產業，這個取捨是正確的，你換到的是「不嚇跑大客戶」的長期價值。

不要用虛構價格，也不要把 offers 改成 AggregateOffer 來規避無公開價格的問題；Google 的 Offer 與 AggregateOffer 都有各自的價格與幣別要求。若頁面沒有公開售價，就讓結構化資料忠實反映可見內容，移除不一致的 Offer，並接受價格型商品複合式搜尋結果可能不適用。商品名稱、圖片、描述與真實評論仍可保留，但是否顯示星等由 Google 決定。文字與規格應以採購者真正需要的資訊為準，不必為了字數刻意加長；可參考商品頁 SEO。

型錄頁的速度與行動裝置體驗優化

移除購物車互動後，頁面可能少載入部分 JavaScript 與請求，但 WooCommerce、佈景主題或外掛仍可能照常載入相關資產，Core Web Vitals 不會自然改善。應用瀏覽器開發工具與真實使用者資料比較改造前後，再決定是否移除未使用腳本（見 web.dev 的 Core Web Vitals 文件，2024 年）。速度也會影響使用體驗與轉換（見 web.dev 的說明）。

但型錄頁要真的快，你還得主動做幾件事，不能被動地等「關掉購物車」帶來的紅利：

• 圖片壓縮與延遲載入：型錄頁通常圖多，一頁十幾張商品照是常態。裝一套圖片壓縮外掛如 Smush，並開啟 lazy load，首屏之外的圖片等到滾動時才載入，體感速度會差很多。
• 快取策略：沒有個人化價格的型錄頁通常適合整頁快取，但仍要排除登入狀態、詢價 nonce 與其他動態內容。成效依主機、CDN 與快取命中率而異，不保證毫秒級載入。
• 清理沒用的腳本：很多 WooCommerce 擴充（金流、物流、推薦商品）會在每個頁面都注入 JS，型錄頁根本用不到。用資產管理類外掛把這些腳本在型錄頁移除，能再省下可觀的載入時間。

講具體一點，Core Web Vitals 三個核心指標在型錄頁上各有要注意的地方。LCP（最大內容繪製）通常落在商品主圖，所以首圖一定要壓縮、一定要設正確尺寸、最好用現代格式（WebP 或 AVIF），別讓一張五 MB 的直出原圖拖垮整頁。CLS（累計版面位移）常出在商品圖下方沒有預留高度、或字型載入時把版面往下推，型錄頁因為互動元素少，這項通常容易過關，但仍要替圖片與廣告區塊預留固定比例的高度。INP（互動到下一次繪製）在型錄頁負擔本來就輕（沒有加入購物車的 AJAX 往返），但如果你裝了重的詢價表單或彈出視窗，記得讓表單延遲載入，別讓它在首屏就搶資源。

行動裝置這塊更要盯緊。根據 Statista 的數據，全球網站流量來自行動裝置的比例長年維持在高檔，到 2026 年第一季仍佔約六成。你的詢價按鈕、表單欄位、聯絡入口，全部都得用拇指測試一遍：按鈕夠不夠大、表單在手機上會不會跑版、LINE 跳轉順不順暢。桌面看起來很美的型錄頁，到手機上變成一場災難，這種情況屢見不鮮。

上線前的檢查清單與常見踩坑

型錄模式看似只是「關掉兩個東西」，實際上線時會踩的坑不少。下面整理一份檢查清單，照著走一遍，能幫你省下大量的上線後救火時間。

上線前八項檢查

1. 確認價格在原始碼裡真的消失：瀏覽器檢視原始碼，搜尋金額數字。還在的話，你的 CSS 隱藏是自欺欺人，換成 remove_action 或外掛。
2. 用 Google 測試工具驗證 Schema：確認 Product Schema 與畫面可見內容一致。沒有公開價格時移除不適用的 Offer；「詢價」不是有效的 price 值。
3. 檢查可變商品（variable product）：有顏色、尺寸規格的商品，關掉價格後選項能不能正常顯示、會不會出現 JS 錯誤；這類商品的選項與前端腳本較多，值得優先測試。
4. 測試購物車頁與結帳頁：確定型錄模式沒有誤傷你的零售流程。如果你的店是混合模式，更要確認「該關的關了、該開的還能開」。
5. 行動裝置實測：拿起手機，從分類頁一路點到單品頁，按詢價按鈕，填表單或跳 LINE。親自走完一次完整的訪客旅程。
6. 備份還原點：上線前做一次完整備份。出問題時能一鍵回到改動前的狀態，比什麼都重要。
7. 詢價管道實測：自己發一封詢價單、自己加一則 LINE 訊息，確認後端真的收得到。很多人改完整個月才發現詢價信件全進了垃圾信箱，白白流失名單。
8. 追蹤碼埋設：在詢價按鈕與表單送出事件上埋好追蹤，上線第一天就有數字可以看，不用等一個月才回頭補。

三個最常見的踩坑

坑一：只改了單品頁，忘了列表頁。很多人只移除單品頁的價格與購物車，結果分類頁、搜尋結果、相關商品區塊的價格照樣秀。記得勾點要兩邊都處理，前面那張勾點表就是給你對照用的。

坑二：外掛衝突導致白屏。Catalog Mode 外掛跟某些快取、SEO、會員外掛搶同一個勾點時，輕則顯示異常，重則整個商品頁白屏。遇到這種情況，先關掉其他外掛逐一排查，找出衝突源頭再決定要不要換外掛。

坑三：改完忘記清快取。若程式碼或外掛設定已更新，畫面卻沒有變化，快取是常見檢查點之一。依序清除頁面快取、CDN 與瀏覽器快取，再檢查佈景主題覆寫與勾點優先序。

三步行動方案：今天就讓你的展示型商品頁動起來

讀到這裡，你手上的資訊已經足夠把型錄模式做起來。這裡給你一個最小可行的三步方案，不用一次到位，先讓它在這週內動起來。

1. 決定路線：你願意碰程式碼嗎？願意的話走 functions.php 那條（乾淨、長期省事）；不願意就走 YITH 外掛（後台點一點，附完整詢價表單）。不要選 CSS 那條，那是給過渡期用的。
2. 接上一個詢價入口：不管是表單、LINE 按鈕、還是導到聯絡頁的按鈕，一定要有「下一步」。沒有詢價入口的型錄頁，只是把訂單擋掉，毫無意義。
3. 用原始碼與 Schema 測試雙重驗證：上線後第一件事，確認價格在原始碼裡真的消失了，Product Schema 也符合預期。這一步做扎實，SEO 與定價策略兩邊都不會出包。

WooCommerce 是市佔最高的 WordPress 電商解決方案，根據 W3Techs 2026 年中的長期統計，它在所有使用電商技術的網站裡始終維持領先。這意味著你現在手上的這套系統，背後有龐大的生態、文件、與解方。型錄模式不是 WooCommerce 的次要功能，而是它靈活性的證明：同一套系統，既可以是賣場，也可以是型錄，差別只在你怎麼操作那些勾點。

把型錄頁當成你與客戶對話的起點，而不是販售的終點。當訪客願意為你的商品停下來、留下詢問，那才是這套改造真正的價值所在。如果你的 WooCommerce 商店還在起步階段、連基本商品上架都還沒理順，建議先回頭把WooCommerce 商店架設的完整流程走穩，型錄模式是建立在商品資料齊全的基礎上的進階動作，地基不穩，上層再漂亮也撐不久。現在，挑一條路線，打開你的後台，開始動手吧。動手永遠比看再多教學都有效，你會在實作中遇到屬於自己網站的獨特狀況，那些才是真正長本事的時刻。