=== Simple AJAX Product Search for WooCommerce ===
Tags: woocommerce, ajax search, product search, live search, search overlay
Requires at least: 5.5
Tested up to: 6.8
Requires PHP: 7.4
Stable tag: 1.0
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html

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

== Description ==

🚀 **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**

---

== Installation ==

1. Upload the plugin folder to `/wp-content/plugins/simple-ajax-product-search-for-woocommerce/` — or install it via **Plugins → Add New**.
2. Activate the plugin through the 'Plugins' screen in WordPress.
3. Visit **Simple AJAX Search** in the WP Admin menu to configure settings.
4. Add the search toggle via:
   - Appearance → Menus
   - The shortcode
   - The Gutenberg block

---

== Frequently Asked Questions ==

= Is this plugin compatible with any theme? =
Yes, it is designed to work with any WooCommerce compatible theme.

= Can I customise colours and styling? =
Yes, the free version includes essential visual options. Pro unlocks advanced layout and logo controls.

= Is the overlay mobile-friendly? =
Absolutely, it is fully responsive and optimised for mobile devices.

= Does this plugin support "Load More" functionality? =
Yes, this is available in the **Pro version**.

= Does it include a Gutenberg block? =
Yes, the toggle button can be inserted anywhere using the block editor.

---

== Screenshots ==

1. 🔍 **Search overlay (frontend)** — Live AJAX results displayed in the overlay.
2. 🔍 **Mobile search overlay (frontend)** — Live AJAX results displayed in the overlay on mobile devices.
3. ⚙️ **Admin settings panel (backend)** — Configure layout, behaviour, styling and Pro options.
4. 🧭 **Search toggle in the navigation menu (frontend)** — Seamless integration with any menu.
5. 🎛 **Navigation menu setup (backend)** — Add the toggle via Appearance → Menus.
6. 🧩 **Gutenberg block (backend)** — Insert the search toggle into templates.

---

== 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

---

== Changelog ==

= 1.0 =
* Initial release 🎉

---

== Upgrade Notice ==

= 1.0 =
Initial stable release of the plugin.

---

== Credits ==

Developed by **TFB Global Ltd**