Skip to main content

Developers quickstart guide to ajax live search

This tutorial is going to take you through the process of extending ajax live search via addons. We are going to assume that you know the basics of developing WordPress plugins. If not, then take a look at the codex first.

We will create a WordPress plugin that replaces the text that is displayed at the top of search results. By default, ajax live search displays the number of found results;

However, we are going to change it to display the text `Results for $query`, to where query is the term that the user was searching for.

To accomplish this; we will attach a filter to the following hook: als_before_results

On your desktop; create a new file and name it `my-plugin.php`.

Now open it using your favourite editor (I use VS Code) and type the following. If you have a basic idea of plugin development, then the following codes should be very simple to follow up.

Plugin Name: My Plugin Name
Plugin URI:
Description: A basic description of my plugin.
Author: John Doe
Version: 1.0
Author URI:

In the same file, append the following:

 function my_custom_result_text($text){
	$query = sanitize_text_field( $_GET['s'] );
	return __("Search results for: $query");
 add_filter('als_before_results', 'my_custom_result_text');

Our addon is now complete. Compress it into a zip file. Now head over to your plugins dashboard and click on add new, then click on upload. After WordPress completes uploading it, click on activate.

Now visit the front-end and try to search for anything then submit the form. You should be able to see our text showing up at the top of results instead of the default text.

This is a list of other filters that you can hook into in your custom addon. The list is not complete and we aim to update it whenever we come across a new filter hook.

Name Since
als_settings_tabs_array 1.0.0
als_get_settings_page 1.0.0
als_admin_settings_sanitize_option 1.0.0
als_admin_settings_sanitize_option_{$option_name} 1.0.0
als_general_settings 1.0.0
als_get_settings_{$id} 1.0.0
als_searching_settings 1.0.0
als_results_settings 1.0.0
als_search_themes 1.0.0
als_get_sections_{$id} 1.0.0
als_settings_form_method_tab_{$tab} 1.0.0
als_search_string 1.0.0
als_search_results_count 1.0.0
als_search_post_in 1.0.0
als_author_in 1.0.0
als_author_not_in 1.0.0
als_author_name 1.0.0
als_cat 1.0.0
als_category_name 1.0.0
als_category_in 1.0.0
als_category_not_in 1.0.0
als_tag 1.0.0
als_tag_in 1.0.0
als_tag_not_in 1.0.0
als_index_post_types 1.0.0
als_date_query 1.0.0
als_before_results 1.0.0
als_found_post_ids 1.0.0
als_can_search 1.0.0
als_search_results 1.0.0

This list lists some of the action hooks in WordPress. it's also still in development mode and other hooks will be inserted here as soon as we come across.

Name Since
als_before_results 1.0.0
als_after_results 1.0.0
als_before_authors 1.0.0
als_after_authors 1.0.0
als_before_sponsored 1.0.0
als_after_sponsored 1.0.0

Now that you have a basic idea of what hooks ajax live search provides; go ahead and take a look at the api-docs where we cover all the functions and classes used in ajax live search.