---
title: "How to Add Ajax Search for WooCommerce Products in Elementor?"
url: https://theplusaddons.com/docs/add-ajax-search-for-woocommerce-products-in-elementor/
date: 2023-09-13
modified: 2026-04-10
lang: en
author: "Aditya Sharma"
description: "One way to improve the user experience on your WooCommerce-based online store is by using Ajax search. Ajax search enables users to search for products without having to refresh the..."
image: https://theplusaddons.com/wp-content/uploads/2023/09/How-to-Add-Ajax-Search-for-WooCommerce-Products-in-Elementor_-1024x536.jpg
word_count: 259
---

# How to Add Ajax Search for WooCommerce Products in Elementor?

## 

- Implements Ajax search functionality for WooCommerce products using the Search Bar widget from The Plus Addons for Elementor.
- Requires installation and activation of The Plus Addons for Elementor to utilize the Search Bar widget features.
- Enables AJAX Search by selecting the option in the Extra Option tab after adding the Search Bar widget to a page or template.

One way to improve the user experience on your WooCommerce-based online store is by using Ajax search. Ajax search enables users to search for products without having to refresh the page and wait for the results to load.

With the Search Bar widget from The Plus Addons for Elementor, you can easily add an Ajax search for WooCommerce products. 

*To check the complete feature overview documentation of The Plus Addons for Elementor Search Bar widget, [click here](/docs/search-bar-widget-settings-overview/).*

***Requirement  - This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/plus-search-filters/advanced-wp-ajax-searchbar/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

To do this, make sure you’ve added some products to your WooCommerce store.

Then, add the Search Bar widget on the page or template and follow the steps -

1. Open the item under **Search Bar** and select **Post** from the **Source** dropdown.

2. From the **Select Type** dropdown, select **Products**.

> *Note: Make sure to remove Posts, it will be selected by default.*

![search bar product](https://theplusaddons.com/wp-content/uploads/2023/09/search-bar-product.png)

Now, you should be able to see a dropdown beside the search bar.

3. Now to turn this into an Ajax search, go to **Extra Option** tab and make sure the **AJAX Search** is enabled.

![search bar ajax search](https://theplusaddons.com/wp-content/uploads/2023/09/search-bar-ajax-search.png)

> *Note: The AJAX Search will be enabled by default.*

Now you can select product from the dropdown, or you can directly search in the search field, and you’ll instantly get the result there.

You can click on any item to go to the product page directly.

![search bar product demo](https://theplusaddons.com/wp-content/uploads/2023/09/search-bar-product-demo.gif)

Also, read [How to Search WooCommerce Products by Category in Elementor](https://theplusaddons.com/docs/search-woocommerce-products-by-category-in-elementor/).