Skip to Main Content

How to add Ajax live search to a WordPress website

Divi: the easiest WordPress theme to use

Easily create your website with Elementor

Elementor allows you to easily create any website design with a professional look. Stop paying expensive for what you can do yourself. [Free]

Do you want to know how to add Live Ajax search to a WordPress website?

Adding Instant Search to WordPress improves a website's default search and makes it easier for your visitors to find the pages and articles they are looking for.

In this article, we'll show you how to add Ajax Live Search to your WordPress website step by step.

Why add Live Ajax search to WordPress?

Ajax live search, also known as instant search, improves the default WordPress search experience by adding the drop-down and autocomplete functionality common in search engines like Google.

Here's an example of this in action:

how to add Ajax Live search

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

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

That being said, let's see how you can just add Ajax live search to your WordPress blog or website.

Add Ajax Live Search to WordPress with a WordPress Plugin

The easiest way to add Ajax live search to WordPress is to use the plugin SearchWP. It is one of the best WordPress search plugins on the market used by over 30 websites.

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

For this tutorial you can use the free plugin SearchWP Live Ajax Search, because it automatically activates Ajax live search.

The 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 Ajax's live search feature.

Displaying Ajax Live Search on your WordPress site

Since any active search bar now has a live search, all you have to do is decide where you want it to appear.

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

Adding Ajax Live Search to the WordPress Sidebar

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

To add the search widget to WordPress, just go to Appearance »Widgets to bring up the block-based widget editor.

how to add Ajax Live search

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 " Main Sidebar But yours may have a different name depending on your theme.

Just click on the '+'under the sidebar section.

Divi: The best WordPress theme of all time!

With over 901.000 downloads, Divi is the most popular WordPress theme in the world. It is complete, easy to use and comes with more than 62 free templates. [Recommended]

Then type 'SearchWP' in the search bar and click on the icon 'SearchWP Live Search'.

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

how to add Ajax Live search

You can customize the section Title to change the header of the search box. When you are finished, click the button Update profile to save your changes and put the search bar online.

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

You can follow the same process to add the live search bar to any other widget area on your website.

Adding Ajax Live Search to WordPress Pages

You can also add an Ajax live search box to other pages on your website. For example, you can have an archive page that allows your visitors to search your content.

To do this, you 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, then click on the page you want to edit.

Once the page is open, click on the '+'on the page editor screen.

This will bring up the blocks menu.

Next, type "Search" into the box, then click 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 placeholder text in the search box.

After that, be sure to click on the " Update profile In the upper right corner of your page.

Are you looking for the best WordPress themes and plugins?

Download the best plugins and WordPress themes on Envato and easily create your website. Already more than 49.720.000 downloads. [EXCLUSIVE]

Now your visitors can use the live search bar on your website to quickly find what they are 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 that goes beyond post content and indexes everything on your website including custom fields, ACF fields, text files, PDF document content, custom tables, custom taxonomies, WooCommerce product attributes, etc.

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

You also get the Metrics feature which lets you see what your visitors are looking for, and many other powerful features to further enhance the search functionality on your website.

Read also: How to exclude pages from WordPress search results

Discover also some premium WordPress plugins additional 

You can use other plugins to display countdowns on your WordPress blog. In what follows, I propose some of them.

1. Coming Soon CountDown

Coming Soon CountDown is one of the most popular premium WordPress countdown plugins on the WordPress platform. It has 2 countdown templates, as well as 10 kinds of wallpapers to make them more beautiful and attractive.

Coming soon countdown responsive wordpress plugin

Indeed, Coming Soon CountDown allows you to continue your work on your website While your Visitors see displayed the 'Coming Soon' page. When you're done, you can get your website back online with just the push of a single button.

We also invite you to discover our 10 WordPress plugins to improve the visual of your website

It is also possible to decide which users may or may not see the website depending on their statuses. If only part of the website is to be submitted to the "Coming Soon" page, then you can also define which pages are available to your visitors and which are not.

Download | Demo Web hosting

2. WooCommerce Sales Countdown

WooCommerce Sales Countdown is a fantastic premium WordPress plugin designed to promote sales campaigns on your e-commerce website. 

Woocommerce sales countdown

It sets up a dedicated countdown area with the product on sale, and tells your customers how much time is left to purchase said product at a low price. This plugin also gives you the option to add a countdown to the upcoming balance period.

Download | Demo | Web hosting

3. Offer CountDown Timer Pro

The WordPress premium Offer Countdown Timer Pro plugin allows you to create countdowns for the offers you offer on your website. Packed with handy features to intelligently adapt to e-commerce websites, this plugin is sure to get the most out of your offerings.

Offer countdown timer pro wordpress plugin for events products offers

The most interesting thing about it is the fact that it is very easy to set up and use. You can easily set the timer for the different offers on each page of your website, create a widget, set different time zones, set the expiration time for the offers, etc.

Easily create your Online Store

Download free WooCommerce, the best e-commerce plugins to sell your physical and digital products on WordPress. [Recommended]

Here are our 6 WordPress plugins to ensure RGPD compliance of a blog

This premium WordPress plugin also gives you the ability to customize the look of your countdown timer.

Download | Demo | Web hosting

Recommended Resources

Find out about other recommended resources to help you build and manage your website.

Conclusion

There ! That's it for this tutorial. We hope this article has helped you learn how to add live Ajax search to your WordPress site. Do not hesitate to share with your friends on your favorite social networks

However, you will also be able to consult our resources, if you need more elements to carry out your projects of creation of Internet sites, by consulting our guide on the WordPress blog creation.

But, in the meantime, tell us about your Comments and suggestions in the dedicated section.

...  

This article features 0 comments

Leave a comment

Your email address will not be published. Required fields are marked with *

This site uses Akismet to reduce unwanted. Learn more about how your comments data is used.

Back To Top
0 shares
Share
tweet
Save