如何實現WooCommerce產品智慧搜尋

WooCommerce有一個內建的搜尋功能,但它不太擅長查詢產品。用更智慧、更快速的搜尋代替它可以改善使用者體驗並帶來更多銷售。

在本教學中,我們將向您展示如何為您的線上商店進行智慧WooCommerce產品搜尋。

如何實現WooCommerce產品智慧搜尋

為什麼要在您的商店中新增WooCommerce智慧搜尋?

預設情況下,WooCommerce帶有內建的產品搜尋功能,但仍有很多不足之處。

它不會在產品屬性、評論、自定義欄位或描述中查詢匹配項。它也很慢,不能提供良好的使用者體驗。

這意味著使用者將無法找到他們正在尋找的產品,您將失去潛在的銷售機會。

WooCommerce預設搜尋

幸運的是,您可以使用一些出色的WooCommerce產品搜尋外掛來解決這個問題。這將使您能夠顯示更多有用的產品搜尋結果,更快地獲取它們,並獲得更多的產品銷售。

話雖如此,讓我們來看看如何輕鬆地將WooCommerce產品智慧搜尋功能新增到您的線上商店。

方法 1. 使用Ajax Search for WooCommerce進行更好的WooCommerce產品搜尋

這種方法更簡單,推薦給大多數店主。

在本教學中,我們將使用Ajax Search for WooCommerce專業版,這是市場上最好的WooCommerce產品搜尋外掛。

它會在您的所有產品欄位(包括自定義欄位)中查詢搜尋到的關鍵字。該外掛還可以在不重新載入頁面的情況下顯示結果,並且比預設的WooCommerce搜尋快得多。

這個外掛也有一個免費版本,但它沒有所有強大的功能。

首先,您需要安裝並啟用Ajax Search for WooCommerce外掛。啟用後,您需要單擊WordPress管理側欄中的“Ajax Search for WooCommerce”選單以輸入您的許可證金鑰。您可以在外掛網站上的帳戶下找到此資訊。

Ajax Search for WooCommerce外掛

之後,您可以訪問WooCommerce » Ajax Search Bar頁面來配置外掛設定。只需切換到“Search bar”選項卡即可開始使用。

Ajax Search for WooCommerce外掛搜尋欄設定

從這裡,您可以選擇搜尋框的外觀。您可以顯示和隱藏按鈕、更改搜尋按鈕標籤以及替換佔位符文字。

一旦使用者開始輸入,外掛就會開始獲取和顯示產品結果。您可以自定義要顯示的產品數量以及如何顯示即時結果。

WooCommerce產品智慧搜尋設定

只需切換到“Autocomplete”選項卡並檢視可用選項。如果您不確定,那麼您可以讓它們保持原樣。預設設定適用於大多數線上商店。

接下來,您需要切換到搜尋配置頁面。從這裡,您可以告訴外掛在尋找匹配項時要檢視哪些區域。

WooCommerce產品智慧搜尋配置

如果需要,您可以檢查所有選項。您還可以選擇您可能希望包含在搜尋中的自定義欄位。

最後,該外掛還包括模糊匹配。這些基本上包括可能與使用者正在尋找的產品接近但不完全匹配的產品。我們建議將此設定保持在“Normal”以獲得更相關和更有幫助的結果。

最後,不要忘記單擊“Save changes”按鈕以儲存所有設定。

在您的網站上顯示您的WooCommerce產品搜尋

Ajax Search for WooCommerce為您提供了三種將產品搜尋框新增到WooCommerce商店的方法。

  • 您可以將其新增到商店的導航選單中。
  • 使用小工具在側邊欄中顯示它
  • 使用短程式碼將其手動新增到商店頁面

將WooCommerce產品搜尋新增到導航選單

使用者可能會在頂部導航選單附近尋找搜尋選項。該外掛可以輕鬆地將產品搜尋放在那裡。

只需轉到外觀»選單頁面。確保選擇了您當前的導航選單,然後將“AJAX Search Bar”新增到您的導航選單。

AJAX搜尋欄

不要忘記單擊“儲存選單”按鈕來儲存您的設定。

您現在可以訪問您的商店以檢視新增到您網站導航選單中的產品搜尋。

WooCommerce產品智慧搜尋欄演示

將WooCommerce產品搜尋新增到側邊欄小工具

側邊欄也是顯示產品搜尋選項的熱門位置。

只需轉到外觀 » 小工具頁面並將“AJAX search bar”小工具新增到側邊欄。

AJAX搜尋欄新增至側邊欄

或者,您可以提供標題並從小工具設定中為您的搜尋欄位選擇佈局。

不要忘記單擊“Save”按鈕來儲存您的小工具設定。

您現在可以訪問您的商店,您會在側邊欄中看到搜尋框。

WooCommerce產品智慧搜尋側邊欄演示

使用簡碼新增WooCommerce產品搜尋

如果您為商店頁面或產品目錄使用自定義登入頁面,那麼您可能希望在該特定頁面或文章上顯示產品搜尋。

該外掛帶有一個短程式碼,可讓您輕鬆做到這一點。只需編輯要顯示搜尋框的帖子或頁面。

在編輯螢幕上,單擊新增新塊按鈕 (+),然後插入短程式碼區塊。在短程式碼塊內,您只需輸入以下短程式碼:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
[wcas-search-form]
[wcas-search-form]
[wcas-search-form]

WooCommerce產品智慧搜尋短程式碼

不要忘記釋出、儲存或更新您的文章/頁面。

您現在可以訪問該特定頁面或發帖以檢視顯示在那裡的頁面搜尋框。

WooCommerce產品智慧搜尋欄頁面/文章演示

方法 2. 使用SearchWP建立更智慧的WooCommerce搜尋

這種方法適用於也有很多非產品相關內容的店主,他們希望為所有內容提供更好的搜尋體驗。

SearchWP是市場上最好的WordPress搜尋外掛,並且還附帶一個 WooCommerce外掛,可以幫助您改進WooCommerce產品搜尋。

SearchWP的優勢在於它還可以索引您的部落格文章和登入頁面。

缺點是他們的即時搜尋功能不會在結果中顯示產品縮圖。作為店主,您希望獲得更直觀的搜尋體驗以立即吸引客戶。

您需要做的第一件事是安裝並啟用SearchWP外掛。注意:您至少需要PRO計劃才能訪問WooCommerce整合。

啟用後,您需要訪問設定 » SearchWP頁面並切換到許可證選項卡以輸入您的許可證金鑰。

SearchWP授權

接下來,您需要安裝並啟用WooCommerce整合擴充套件。您可以從SearchWP網站上的帳戶區域下載它並像安裝任何其他WordPress外掛一樣安裝它。

現在您已準備好設定SearchWP自定義搜尋引擎。

只需轉到設定»SearchWP頁面,然後單擊“Sources & Settings”按鈕。

SearchWP外掛搜尋源及設定

這將彈出一個彈出視窗,您需要確保選中產品旁邊的覈取方塊。

SearchWP外掛搜尋源

接下來,單擊“Done”按鈕關閉彈出視窗並向下滾動到“產品”部分。

預設情況下,外掛將檢視產品標題、內容(描述)、slug 和摘錄(簡短描述)以進行匹配。您可以通過單擊“Add/Remove Attributes”按鈕來擴充套件它。

SearchWP外掛搜尋匹配項設定

這將彈出一個彈出視窗,您可以在其中檢查以包含評論或選擇自定義欄位和分類法。我們在自定義欄位中新增了顏色和尺寸,並在分類法中新增了產品類別和產品標籤。

SearchWP外掛搜尋引擎設定

您現在可以繼續並單擊“Save Engines”按鈕來儲存您的設定。然後它將開始在後臺重建您的搜尋索引。

SearchWP會自動查詢您的WooCommerce或WordPress搜尋表單並替換它們。您的WooCommerce主題可能已經有顯示搜尋選項的選項。

您可以訪問您的網站來試用搜尋功能。您會注意到它變慢了,並且會重新載入頁面以顯示搜尋結果。

SearchWP搜尋結果展示

您可以通過從SearchWP的網站下載Live Search擴充套件程式來更改該行為。下載後,您可以像安裝任何其他WordPress外掛一樣安裝和啟用它。

啟用後,您只需轉到外觀»小工具頁面並將“SearchWP Live Search”小工具新增到側邊欄。

SearchWP Live Search小工具

不要忘記單擊“Save”按鈕以儲存您的小部件設定。

之後,您可以訪問您的網站以檢視正在執行的WooCommerce智慧搜尋。您會注意到SearchWP將在實時搜尋結果中顯示產品,但沒有產品縮圖。

SearchWP實時搜尋

哪個是最好的WooCommerce產品搜尋外掛?

Ajax Search for WooCommerceSearchWP都擅長查詢預設WooCommerce搜尋無法顯示的產品。

但是,Ajax Search for WooCommerce速度更快並提供更好的使用者體驗。電子商務商店中更快的搜尋功能最終會帶來更多的銷售額。

它也更易於使用,您無需安裝多個外掛即可在您的網站上建立更好的產品搜尋。

我們希望本教學能幫助您瞭解如何輕鬆地為您的線上商店進行WooCommerce產品智慧搜尋。

評論留言