----------------------------------------------------------------------------------------------------------- Overview The ATN AJAX Search is a custom WordPress plugin that provides an AJAX-powered search feature. It allows users to search for posts dynamically without refreshing the page. This plugin supports searching different post types, displays search results as users type, and shows relevant information such as titles, excerpts, and featured images. ----------------------------------------------------------------------------------------------------------- Features Live Search: As users type, the plugin dynamically fetches and displays search results without reloading the page. Supports Multiple Post Types: Search can be tailored to different post types (e.g., product, post, page, etc.). Debounce for Performance: The search input is debounced to ensure it doesn't trigger too many requests while typing. Customizable Display: You can customize the layout and appearance of the search results via CSS. ----------------------------------------------------------------------------------------------------------- How to Install the Plugin Upload the Plugin: Upload the ajax-search-plugin folder to the wp-content/plugins/ directory of your WordPress installation. Activate the Plugin: Log in to your WordPress admin panel. Go to Plugins > Installed Plugins. Find the "AJAX Search Plugin" and click Activate. Set Up the Plugin: After activation, the plugin will be ready to use. You can add the search form to any page or post via a shortcode. ----------------------------------------------------------------------------------------------------------- How to Use the Plugin 1. Display the Search Form To add the AJAX search form to a page or post, use the following shortcode: [ajax_search_form] You can also specify the post type you want to search by adding the post_type attribute: [ajax_search_form post_type="product"] By default, the post type is set to product, but you can change it to other custom post types (e.g., post, page, event, etc.). Example: Default search for product post type: [ajax_search_form] Search for post post type: [ajax_search_form post_type="post"] This shortcode will render a search input box on the page where you insert it. ----------------------------------------------------------------------------------------------------------- 2. How the Search Works As the user types in the search box, the plugin will wait until at least 3 characters have been entered. It then sends the search query to the server via AJAX (without reloading the page). The plugin fetches posts matching the search query from the specified post type and returns them as results. If the results are found, they will be displayed under the search box, showing: The post title (with a link to the full post). The post excerpt. The featured image (if available). A "View" button to go directly to the post. ----------------------------------------------------------------------------------------------------------- Plugin File Structure Here’s an overview of the plugin's file structure: ajax-search-plugin/ │ ├── js/ │ └── ajax-search.js (Handles the AJAX request and search results display) │ ├── css/ │ └── style.css (Custom styling for search form and results) │ └── ajax-search-plugin.php (Main plugin file with WordPress hooks and functions) ----------------------------------------------------------------------------------------------------------- How the Plugin Works JavaScript (js/ajax-search.js): Listens for the keyup event on the search input. Sends the search query and post type to admin-ajax.php via AJAX. Displays search results dynamically below the search form. PHP (ajax-search-plugin.php): enqueue_scripts(): Registers the JavaScript and CSS files and passes the AJAX URL to the JavaScript file. ajax_search_plugin_ajax_handler(): Handles the AJAX request by querying posts matching the search query and returning the results as JSON. ajax_search_plugin_form(): Displays the search form, accepts the post_type parameter, and outputs HTML for the search input and results container. ----------------------------------------------------------------------------------------------------------- License This plugin is released under the MIT License. You are free to modify, distribute, or use this plugin in your WordPress projects. ----------------------------------------------------------------------------------------------------------- By following this documentation, you should be able to easily integrate and use the AJAX search feature within your WordPress website. Feel free to customize the plugin to fit your needs!