Fast and responsive AJAX product search for WooCommerce with instant results, clean UI and simple menu or shortcode integration.

Syed Balkhi

WPBeginner

WordPress Full Screen Search Overlay

Create a Full Screen Search Overlay Effect in WordPress.

LebCit

Full Screen Morphing Search

Responsive Full Screen Morphing Search Page Overlay With Predictive Autocomplete !

tfbgloballtd

🚀 Simple AJAX Product Search for WooCommerce delivers a fast, modern and intuitive product search experience that helps customers find items instantly without reloading the page.
As the user types, results appear immediately in a clean, full screen overlay. This provides a distraction free search experience that improves product discovery and increases conversions.
💡 Lightweight, responsive and compatible with major themes, this plugin integrates seamlessly with WooCommerce stores of any size.
<h3>✨ Free Features (✔ included)</h3>
✔ Instant AJAX product search 
✔ Full screen responsive search overlay 
✔ Smooth animations & modern design 
✔ Add a search toggle to your navigation menu 
✔ Dedicated Gutenberg block for easy placement 
✔ Shortcode support: 
[sapsfwc_button label=”Search Products”] 
✔ Works with any WooCommerce compatible theme 
✔ Fully responsive (mobile, tablet, desktop) 
✔ Lightweight & fast — minimal impact on performance
<h3>🔥 Pro Features (🚀 upgrade available)</h3>
Unlock additional layout and display options with Simple AJAX Product Search for WooCommerce Pro:
📐 Advanced Layout Controls 
– Load More results button 
– Products Per Page 
– Columns on Desktop 
– Columns on Mobile 
– Custom Container Width 
– Adjustable Screen Height
🎨 Branding Enhancements 
– Logo Image 
– Max Logo Width 
– Max Logo Height
These options let you fine-tune the search overlay and improve product visibility.
<h3>⌨ Shortcode</h3>
Use this shortcode anywhere you’d like to display the toggle button:
[sapsfwc_button label=”Search Products”]
<h3>🧩 Gutenberg Block</h3>
Insert the search toggle directly inside templates, headers or page layouts using the included block:
Simple AJAX Product Search Toggle
<h3>Source Code</h3>
The human-readable source for compiled block files is included in the plugin.
Block source (for files under blocks/…/build): 
– blocks/simple-ajax-product-search-toggle/ (edit.js, save.js, index.js, editor.scss, style.scss)
<h3>Build Instructions</h3>
Requires Node.js. From within the block directory:
<ol>
<li>cd blocks/simple-ajax-product-search-toggle</li>
<li>npm install</li>
<li>npm run build (outputs to /build)</li>
</ol>
<h3>Third-Party Libraries</h3>
<ul>
<li>wp-color-picker-alpha 
File: <code>assets/js/wp-color-picker-alpha.min.js</code> 
Source: https://github.com/kallookoo/wp-color-picker-alpha 
License: GPLv2 or later</li>
</ul>
<h3>Credits</h3>
Developed by TFB Global Ltd

Alternatives to Simple AJAX Product Search for WooCommerce

Top alternatives