Read this blog on Woocommerce Ajax product filter without plugin for more information.

If your WooCommerce store has many products, online customers might get easily lost. There might be way too many pages to visit (“product pagination”) before finding the product they’re looking for. Needless to say, this is a huge loss for your business. Possibly, they’ll never come back.
woocommerce ajax product filter without plugin

If you shop on popular eCommerce websites such as Amazon and eBay, you know they carry a billion products each or so. Thankfully, on top of the very useful search bar, these websites provide “product filters” in the sidebar. You can refine by price, reviews, tag, category, and so on; the website won’t “refresh” but instead it will return the filtered results immediately on that same page.

These are called “Ajax Product Filters” (Ajax is a set of applications that run in the background without forcing a website page refresh). And as Amazon and eBay just proved to you, these filters are absolutely a must if you have 100+ WooCommerce products.

The easiest way to add it is by using a plugin, but if you want a non-plugin method then follow the steps below.

How to Add Woocommerce AJAX Product Filter Without Plugin

Here we will visit the steps required to add the ExpertRec Custom search engine to your website. This is one of the easiest setup processes of all the available options out there and is highly recommended. It will add AJAX product filters along with the search results.

  1. Navigate to https://cse.expertrec.com/newuser?platform=cse and signup with your Google ID.
  2. Enter your website’s URL when prompted. You can select a server location near you and add the URL of your sitemap if you wish to. These will be auto-detected otherwise.
  3. You can play around with the settings and customize the UI as the crawl runs. Once it is complete, you can check out a fully functional demo before taking the search to your website.
  4. You can take the search to your website with little to no effort. All you need to do is to paste the code snippet available on the dashboard on your website.

ExpertRec comes with more customization options that you can explore. You can read this article to find a more detailed guide on the installation and configuration.

You may also like