Directory / plugin

Simple AJAX Product Search for WooCommerce

v1.0 ยท by tfbgloballtd

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

View on WordPress.org

About this plugin

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

Plugin tags