wordpress ajax search | The Blog Pros

Do you want to add a taxonomies filter to your WordPress search?

Allowing users to search based on categories, tags, custom fields, and post types offers a great user experience. However, the default WordPress search is not very good or advanced enough to offer this feature.

In this article, we will show you how to add an Ajax powered taxonomies filter in WordPress search.

How to add ajax taxonomies filter in WordPress search

Why Use Ajax Taxonomies Filter in WordPress Search?

Ajax-powered search is faster and provides a better user experience than the default WordPress search function.

For example, a car dealership website may have custom taxonomies for different vehicle types, price ranges, models, and more. Ajax filters can help users find exactly what they need.

You can add similar search filters in WordPress and improve the user experience of your site. It also helps website administrators to organize their content, so that it could be easily found by users.

However, the default WordPress search is not that powerful and doesn’t offer filter content based on categories, tags, post types, product details, and more. If you use custom taxonomies on your site, the default search performs even worse.

This is where you’ll need a WordPress plugin to help you out. Let’s see how to add an Ajax taxonomies filter to WordPress search.

We’ll cover 2 methods in this article. The first method will help you show filters on the front end of your WordPress website. The second method will help you improve the default WordPress search and include taxonomies when searching posts and pages on your site.

Simply click the links below to jump ahead to your preferred section:

Method 1: Add Ajax Taxonomies to WordPress Search using SearchWP
Method 2: Add Ajax Taxonomies Filter Using Search & Filter Plugin

Method 1: Add Ajax Taxonomies to WordPress Search using SearchWP

You can add Ajax taxonomies to WordPress search by using SearchWP. It is the best search plugin for WordPress and makes it easy for users to find what they’re looking for on your website.

It goes beyond using just the content on your blog posts and pages to look up things. SearchWP uses custom fields, taxonomies, WooCommerce product attributes, text files, custom tables, and more.

Do note that SearchWP won’t show the taxonomies filters on the frontend of your website. However, it will include them in the search process and improve the default WordPress search.

First, you’ll need to visit the SearchWP website and sign up for an account. After that, you can download and install the plugin on your site. If you need help, then please see our guide on how to install a WordPress plugin.

Upon activation, you will need to go to SearchWP » Settings from the WordPress admin panel. From here, simply enter the license key, which you can easily find in your account area.

After that, you can go to SearchWP » Algorithm page from the WordPress dashboard.

Here, you can edit the search relevance for your website. For instance, you can increase weights for title, content, slug, and excerpt to help users find what they’re looking for.

To add taxonomies to the search relevance, you can click the ‘Add/Remove Attributes’ button.

Add category and tags to search relevance

Next, a new popup window will open.

You can click the Taxonomies dropdown menu and select whether you’d like to include categories, tags, formats, or all of them in the WordPress search.

Select which taxonomies to add to search

After selecting the taxonomies, don’t forget to click the ‘Done’ button.

You should now see the taxonomies for your WordPress blog post search algorithm. You can use the slider to increase their relevance in WordPress searches.

You can also click the ‘Edit Rule’ button to determine what content can and cannot show up in the search results.

For instance, SearchWP will include all the categories on your website. You can remove categories from which you don’t want the content to show up or add multiple conditions to customize the search results.

Don’t forget to click the ‘Done’ button when finished.

You can now edit the search algorithm for your pages, media files, WooCommerce products, and more to show up in SearchWP.

Now, whenever a visitor searches for pages and posts on your website, SearchWP will include taxonomies during the search process.

You can use a free WordPress plugin like Search & Filter to add an Ajax taxonomies filter to your website. It is very easy to use and allows your users to search based on category, tag, custom taxonomy, post type, and more.

First, you will need to install and activate the Search & Filter WordPress plugin. For more details, please see our guide on how to install a WordPress plugin.

Upon activation, you can add a shortcode to show the Ajax taxonomies filter anywhere on your website.

For instance, you can enter the following shortcode to show the category and post-type dropdown filter:

[searchandfilter fields="search,category,post_tag"]

On the other hand, if you want to show headings for categories and tags, then you can add the following shortcode:

[searchandfilter fields="search,category,post_tag" headings=",Categories,Tags"]

Here’s what the Ajax taxonomies search filter looks like on our demo site.

View category and tag heading in sidebar

In the screenshot, you can see the filter in the sidebar where users can use the dropdown menu and select a category or tag.

The plugin also lets you show filters as radio buttons and checkboxes.

You can add the following shortcode anywhere on your site to show taxonomy filters as checkboxes:

[searchandfilter fields="search,category,post_tag" types=",checkbox,checkbox" headings=",Categories,Tags"]

View search filters as checkbox in sidebar

In the screenshot above, you can see the taxonomies filter as checkboxes. Users can simply select categories from which they want to view posts and pages.

We hope this article helped you add Ajax powered taxonomy filter in WordPress search on your site. You may also want to see our guide on how to improve WordPress search and the best live chat software for small businesses.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Add Ajax Taxonomies Filter in WordPress Search first appeared on WPBeginner.

Do you want to add live Ajax search to your WordPress site?

Adding instant search to WordPress improves the default site search and makes it easier for your visitors to find the pages and posts they’re looking for.

In this article, we’ll show you how to add live Ajax search to your WordPress site, step by step.

Why Add Live Ajax Search to WordPress?

Live Ajax search, also called instant search, improves the default WordPress search experience by adding the drop down and autocomplete feature that’s common in search engines like Google.

Here’s an example of this in action:

Live search guesses what users are searching for as they type and helps them find relevant content faster. This is a huge improvement from the default WordPress search.

By helping users find what they’re looking for quickly, live search will help them stay on your site longer, which can increase pageviews and reduce bounce rate.

That being said, let’s take a look at how you can simply add live Ajax search to your WordPress blog or website.

Adding Ajax Search to WordPress with a WordPress Plugin

The easiest way to add Ajax live search to WordPress is using the SearchWP plugin. It’s the best WordPress search plugin on the market used by over 30,000 websites.

This plugin goes beyond indexing post content and will index everything on your website, like custom fields, PDF documents, text files, WooCommerce products, and more.

For this tutorial, you can use the free SearchWP Live Ajax Lite Search plugin, since it automatically enables Ajax live search.

First thing you need to do is install and activate the plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, the default WordPress search form will now automatically include the Ajax live search feature.

Displaying Ajax Live Search on Your WordPress Site

Since any active search bar now has live search, all you have to do is decide where you want them to display.

Below you’ll learn how to add the live search bar to common locations on your WordPress website.

Adding Live Ajax Search to WordPress Sidebar

One of the most popular areas to add a search bar is the WordPress sidebar. This makes it easy for your visitors to do a search no matter where they are on your website.

To add the search widget to WordPress, simply go to Appearance » Widgets to bring up the blocks based widget editor.

Each widget area of your WordPress theme will have a separate tab in the block editor.

On our test site, our sidebar widget area is called ‘Right Sidebar,’ but yours may have a different name depending on your theme.

Simply click the ‘+’ icon underneath the sidebar section.

Then, type ‘SearchWP’ into the search bar and click the ‘SearchWP Live Search’ icon.

This will automatically insert the live Ajax search widget into your sidebar.

You can customize the Title section to change the heading for the search box. When you’re finished, click the Update button to save your changes and make the search bar live.

Now your live search bar will be usable by all of your website visitors.

You can follow the same process to add the live search bar to any other widget area of your website. To add it to your navigation menu area, see our guide on how to add a search bar to your WordPress menu.

Adding Live Ajax Search to WordPress Pages

You may also want to add a live Ajax search box to other pages of your website. For example, you could have an archive page that lets your visitors search through your content.

To do this, you’ll need to navigate to the post or page you want to edit. For this example, we’ll show you how to add the live search bar to a WordPress page.

First, go to Pages » All Pages and then click on the page you want to edit.

Once the page is open, click the ‘+’ icon on the page editor screen.

This will bring up the blocks menu.

Next, type ‘Search’ into the box and then click on the ‘Search’ icon to add it to your page.

It will automatically place the search bar for you.

You can also customize the search title and the placeholder text inside the search box.

After that, make sure to click the ‘Update’ button in the upper right corner of your page.

Now, your visitors can use the live search bar on your website to quickly find what they’re looking for.

You can use the same process to add a search bar to any post or page.

Customizing Instant WordPress Search Results

SearchWP is a very versatile search plugin and goes beyond just the post content and indexes everything on your site including custom fields, ACF fields, text files, PDF document content, custom tables, custom taxonomies, WooCommerce product attributes, and more.

The pro version of the SearchWP plugin lets you completely customize your search results by creating your own relevance scale and adjust the algorithm without writing any code.

You also get the Metrics feature that lets you see what your visitors are searching for, and many other powerful features to further improve your on-site search feature.

We hope this article helped you learn how to add live Ajax search to your WordPress site. You may also want to see our guide on how to choose the best domain name registrar, and our expert picks of the best webinar software for small businesses.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Add Live Ajax Search to Your WordPress Site (The Easy Way) appeared first on WPBeginner.