專注於架設企業網站,分享WordPress教學和Elementor教學

適合Elementor編輯器的最佳搜索過濾外掛程式

更新日期:2023-08-25
本系列教學
加入讀者學習群
我用的頁面編輯器
讓我的客戶網站GTmetrix測分A\A的主機Cloudways
黑五優惠前4個月6折, 戳上方按鈕註冊即可自動帶入優惠碼BFCM2024
所贈主題外掛程式價值>$49
主機送Astra Pro不限網站1年
gmail.comsina.com邮箱,注册易通过
遇到問題,聯繫我

架設企業網站過程中,添加搜索篩檢程式能夠為使用者提供便捷和提高滿意度。 本文中,我們在網上搜集了WordPress的最佳搜索過濾外掛程式,並介紹了它們的優缺點及使用指南。

當一個網站上的產品和文章越多,流覽起來就越困難,對於房地產、電商和餐館列表等網站來說尤其如此。

想像一下,您正在網上瀏覽本地的餐館名單,以便找到一家披薩店。 如果你不得不單獨流覽每一家餐館的列表去查看是否提供披薩、服務好不好、價格如何,那這個過程是令人崩潰的,然而,通過搜索過濾功能,您可以選擇所需的參數進行過濾,只流覽符合條件的餐廳。

WordPress自帶了過濾功能,但已經有些落後了,這使得大量過濾外掛程式的湧現,本文選擇了三個與Elementor編輯器配合良好的篩檢程式進行講解。

什麼是過濾器外掛程式

過濾器外掛程式允許使用者過濾網頁中的文章和產品。 它們通常帶有各種過濾選項和不同的設計樣式配置。 這些外掛程式通常是可以自定義配置的,以便使您的網站用戶擁有便捷舒適的體驗。

其中有一些外掛程式可以很好地與Elementor編輯器配合使用,並且交互方式也很容易。 此外,您可能會發現有兩種類型的過濾系統:「filter」和「facet」,通常他們可以互換使用,但實際上它們是不同的。

Filters:它們在類別配置中更加通用和廣泛,並且在選擇時,它們會排除網站上的其他結果。 在切換搜索內容時,他們會保持不變。 亞馬遜的平均分過濾就是一個很好的例子。 假設你正在找書,一旦你選擇了平均分過濾,譬如選擇客戶評論篩檢程式(讓我們選4星+),那每個後續搜索將是4星或更多,如果你改變了書的題材或語言或其他任何東西,4星+的評論將是不變的。

Facets:它們更具體、更具交互性,並與搜索關鍵詞直接相關。 假設你在亞馬遜上找書,你來到圖書部分,選擇了歷史題材,一旦你點擊它,你就會得到進一步的建議和選擇(比如地區)。 現在,根據您的搜索關鍵詞(如:歷史),您將獲得更多的方面過濾選項(區域、歷史類型等),並且隨著選擇的增多,您將獲得更多的進一步選項。 這讓用戶可以通過應用多個篩檢程式來縮小搜尋結果的範圍。 當您的網站有數百個帖子或產品時,Facet過濾器可以顯著改善客戶和訪問者的瀏覽體驗。

為什麼需要篩檢程式

好了,現在你知道什麼是過濾器外掛程式了,接下來我們討論一下為什麼需要他們。

WordPress 的預設過濾功能

WordPress提供了一些自帶的過濾功能,您可以按類別、標籤、日期和作者進行過濾。 如果需要額外的篩檢程式,你需要寫代碼。

在編碼中,篩檢程式是兩種類型的鉤子之一,另一種是動作,它們為函數提供了一種修改其他函數的數據的方法。 鉤子是一段代碼與另一段代碼進行交互或修改的一種方式。 然而,與動作不同的是,篩檢程式意味著以隔離的方式工作。

要添加過濾器,您必須執行兩個步驟:

  1. 創建一個回調(自定義)函數,運行過濾器時將調用該函數。
  2. 將回調函數添加到將執行函數調用的鉤子中。

這對開發人員來說可能是有意義的,但對我們編碼小白來說,實現起來是天方夜譚。

更多過濾器選項

過濾器外掛程式讓您可以自由地以您希望的方式呈現資訊,並且在網站體驗方面,為您的使用者提供盡可能多的自由。 正如上文所說,WordPress有一些預設的過濾選項,如類別和標籤,這為您提供了一種對內容進行排序的方法。 但是,您一次只能查看一個類別或標籤,不能執行其他操作。 另一方面,過濾器外掛程式可以説明您添加更多的過濾選項,使您的用戶體驗更加流暢和豐富。

設計

過濾器外掛程式有很多設計選項,從顏色到形狀,你可以改變它們的外觀。 此外,您可以選擇不同類型的過濾器,如幻燈片過濾器、複選框篩選器、下拉篩選器等。 您擁有的設計選項越多,您創建的網站就更加靈活可用。

規劃

在我們繼續討論外掛程式之前,我想說,組織和確定您的產品應該如何分類是非常重要的。 您需要先理解這些術語:類別、標籤等等,甚至,你需要制定一個計劃並把它畫出來(原型圖)。

想像一下,你要創建一個外貿商店,賣襯衫。 你打算按尺碼賣嗎? 還是按顏色、領型? 又或是按品牌? 您必須在每件襯衫上添加以下屬性值:顏色、尺碼、領型、品牌等等,當你的使用者用篩檢程式篩選以下內容時:黑色、V領、M碼、品牌X,他們能夠得到他們想要的結果。

如果你已經有了一個網站,含文章或產品,那麼你需要花些時間去研究過濾選項的規則了,你要考慮客戶需要什麼、內容能為他們帶來什麼價值、你設置的搜索是否滿足他們的意圖,有時,一個產品或帖子會有多個屬性,你必須瞭解你想要的最終過濾結果是什麼,並分別添加屬性值。

外掛

接下來我們來說說這三款篩檢程式,並講解他們的優缺點以及如何使用。

FacetWP

FACETWP是一個用於WordPress的高級過濾外掛程式,它允許您使用網站現有的帖子類型、字段和分類法,通過僅顯示相關的過濾選項來為您的使用者提供他們正在尋找的內容。

它基於Facet系統,增強了WordPress的默認搜索功能。 FacetWP包括12個篩選類型,如複選框、下拉菜單、日期範圍和滑塊。 它允許您添加篩選功能到WooCommerce網站中。 由於它是基於Ajax的,因此不需要刷新頁面來過濾它,這使得它的速度非常快。 FACETWP與Elementor配合得很好,同時提供了大量的UI設計選項。

Filters 1 FacetWP

第一步是安裝外掛程式,請從官方網站購買並下載,購買前您可以在線體驗一下。 如果要將其與Elementor集成,您還需要安裝 FacetWP Elementor plugin。 一旦你安裝並啟動它,你就可以開始使用它。

設置它並不是十分困難(有點小難)。 您先得創建一個新的facet或標籤,定義類型和數據源,保存更改,並重新索引頁面。 完成後,只需在Elementor的Posts元素塊中啟用FacetWP,你也可以複製它的簡碼(shortcode)並將其粘貼到Elementor附帶的ShortCode元素塊中。

現在,您可以在ShortCode元素塊中對其進行編輯、設計。 進入元素塊的「高級選項」,根據您的喜好調整邊框、背景等。 並不是所有的配置都能完美地運行,你必須稍微調整一下選項,瞭解你能做什麼和不能做什麼,但最終,它確實能給你很多可能的設計選項。

優點

  • 它使用facets,這為您提供了更多的過濾選項。
  • 它有12種不同的篩選類型可供選擇,可以讓您選擇最適合您的過濾器類型。
  • 它直觀地集成了WooCommerce和Elementor,這對於任何擁有電子商務網站或博客網站的人來說都很重要。
  • 總的來說,FACETWP非常適合中小型企業。

缺點

  • 它並不適用於所有的WordPress主題。
  • 如果您沒有編碼經驗,那麼設置它可能會有點困難,而且總體而言,它對個人使用不太友好。
  • 相比其他只關注過濾的外掛程式,價格似乎有點高

價格:3個網站99美元/年,20個網站249美元/年。

JetSmartFilters

CrocoBlock的JetSmartFilters是另一個基於Ajax的篩檢程式系統,它有七種智慧篩檢程式變體,包括單選篩檢程式、數據範圍篩檢程式、搜尋篩檢程式、活動篩檢程式、範圍篩檢程式、複選框過濾器和檢查範圍篩檢程式。

雖然JetSmartFilters的篩檢程式變化比FACETWP少,但它與其他Jet外掛程式(如JetWooBuilder)配合得很好,JetWooBuilder基本上是WooCommerce所需要的一切。 從產品頁面範本到特殊的小工具,同時,JetEngine—它使您能夠使用Elementor添加和編輯動態內容。

您可以一次使用多個篩檢程式,這允許您自定義頁面,以使其看起來更好或滿足客戶的需求。 雖然沒有說明JetSmartFilters使用了facet系統,您可以像使用FACETWP一樣,選擇多個“類別”來過濾資訊。

Filters 2 JetSmartFilters 2

你可以點擊這裏購買並下載外掛程式。 雖然它沒有試用版,但它很便宜,每年只需15美元。

安裝完並啟動后,您必須創建一個新的篩選器,配置類型和數據源,併發佈它。

發佈后,在Elementor中選擇已配置的篩檢程式,並將其放置在所需的頁面上。

您必須複製Jet-Smart-Filters名稱,並將其設置到posts元素塊的Query部分。

注意:如果你想要過濾器的樣式不同,那必須再創建一個新過濾器來實現了。

優點

  • 有七種智慧篩檢程式可供選擇。
  • 價格為每年24美元,這是一個非常低的價格。
  • 它與Elementor的集成特別好,因為它向編輯器視窗添加了新的元素塊。
  • 在初始設置之後,它變得超快速且易於使用。
  • 它與WooCommerce和其他Jet外掛程式配合得很好。

缺點

  • 沒有FACETWP那麼多篩檢程式。
  • 缺少試用版會讓人猶豫要不要買。

價格:一個網站24美元/年

Search & Filter

Search&Filter是您可以使用的另一種篩檢程式。 該過濾器擁有30000多個活躍安裝,並在WordPress上獲得了很不錯的近5星評價。 它是基於Ajax的,並且像FacetWP和JetSmartFilters一樣,允許多個選項篩選,類似於facets搜索。 我的網站中用的就是它。

它有一個簡單的拖放編輯器,允許您按類別、標籤、自定義分類法、文章類型、文章日期或這些的任意組合進行搜索。 過濾器有多種樣式,如下拉菜單、複選框、單選按鈕或多項選擇。 你可以使用簡碼和小工具把它放在你的主題和文章的任何地方。 它與WooCommerce、WP eCommerce和Easy Digital Downloads相容。

Filters 3 Search and Filter 2

你可以在這裡下載免費版本的外掛程式。 一旦你安裝了外掛程式,進入它的頁面,複製簡碼並將其插入到簡碼元素中即可。

優點

  • 免費版本提供了一個簡單、快速的過濾解決方案。 如果你是建站新手,又希望添加一個簡單的篩檢程式的話,它適合你。

缺點

  • 它需要你知道一定程度的編碼知識,除非你有高級的編碼知識,否則你將無法定製的外觀。
  • 付費版(下圖)提供Ajax、多個表單、拖放選項等高級功能,而免費版您只能一次按一個類別進行搜索,並且需要按“選擇”按鈕才能執行搜索。
image

價格:單個網站20美元/年,無限網站75美元/年。

点赞

0 / 5 0

Your page rank:

Picture of 外貿建站技術姐Bonnie
外貿建站技術姐Bonnie

Bonnie是LOYSEO的創始人,在建站領域有著超過14年的經驗,熱愛能將想法變為現實的WordPress,更是Elementor的忠實使用者~

LOYSEO
讓我的客戶網站GTmetrix測分A\A的主機Cloudways
黑五優惠前4個月6折, 戳上方按鈕註冊即可自動帶入優惠碼BFCM2024
所贈主題外掛程式價值>$49
主機送Astra Pro不限網站1年
gmail.comsina.com邮箱,注册易通过
遇到問題,聯繫我