šŸŽ‰ Use coupon MYXERO to enjoy 20% recurring discount on any plan. View Pricing
Simple AJAX Product Search for WooCommerce
Simple AJAX Product Search for WooCommerce

Simple AJAX Product Search for WooCommerce

0/5 (0 ratings) — active installs Updated Nov 27, 2025
šŸ” <strong>Search overlay (frontend)</strong> — Live AJAX results displayed in the overlay.

šŸ” <strong>Search overlay (frontend)</strong> — Live AJAX results displayed in the overlay.

šŸš€ 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.

✨ Free Features (āœ” included)

āœ” 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

šŸ”„ Pro Features (šŸš€ upgrade available)

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.

⌨ Shortcode

Use this shortcode anywhere you’d like to display the toggle button:

[sapsfwc_button label=”Search Products”]

🧩 Gutenberg Block

Insert the search toggle directly inside templates, headers or page layouts using the included block:

Simple AJAX Product Search Toggle

Source Code

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)

Build Instructions

Requires Node.js. From within the block directory:

  1. cd blocks/simple-ajax-product-search-toggle
  2. npm install
  3. npm run build (outputs to /build)

Third-Party Libraries

  • wp-color-picker-alpha
    File: assets/js/wp-color-picker-alpha.min.js
    Source: https://github.com/kallookoo/wp-color-picker-alpha
    License: GPLv2 or later

Credits

Developed by TFB Global Ltd