---
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-09-27
lang: en
author: "Aditya Sharma"
description: "A store search that reloads the page for every keystroke feels slow next to a live AJAX search that updates results as the shopper types. Turning on AJAX Search with..."
image: https://theplusaddons.com/wp-content/uploads/2023/09/How-to-Add-Ajax-Search-for-WooCommerce-Products-in-Elementor_-1024x536.jpg
word_count: 228
---

# 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.

A store search that reloads the page for every keystroke feels slow next to a live AJAX search that updates results as the shopper types.

Turning on **AJAX Search** with **Select Type** restricted to **Product** and **Enable Price (Woo)** switched on builds exactly that.

For the full settings tour of the **Search Bar** widget, see [Search Bar Widget Settings Overview](https://theplusaddons.com/docs/search-bar-widget-settings-overview/).

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

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-builder/ajax-search-bar/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

## Before You Start

- **Prerequisite:** [Elementor](https://wordpress.org/plugins/elementor/) (free) installed and active.- **Edition:** Search Bar is a **Pro** widget - it requires The Plus Addons for Elementor Pro to be installed and active.- **Widget to enable:** go to **The Plus Addons > Widgets**, search for **Search Bar** and turn its toggle on.- **Prerequisite:** [WooCommerce](https://wordpress.org/plugins/woocommerce/) installed and active, with at least a few products published.

## Steps

Add the Search Bar widget, set **Select Type** to **Product** only, then turn on **AJAX Search** in Extra Option.

In **Results Area**, turn on **Enable Price (Woo)** and **Enable Thumb** so results show a live product preview with price.

![Live AJAX search results showing product thumbnail and price](https://theplusaddons.com/wp-content/uploads/2026/09/search-bar-ajax-woo-search-result.webp)

## Settings Overview

| Setting | What it does | Default |
| ------- | ------------ | ------- |
| AJAX Search | Live search without a page refresh. | Off |
| Select Type | Restricted to Product. | Post |
| Enable Price (Woo) | Shows price on each live result. | Off |

## Related Docs

- [How to Only Search WooCommerce Products in Elementor?](https://theplusaddons.com/docs/only-search-woocommerce-products-in-elementor/)- [How to Add Ajax Load More Button to Search Result in Elementor?](https://theplusaddons.com/docs/add-ajax-load-more-button-to-search-result-in-elementor/)