Add the perfect search engine to your WordPress website (spoiler: Algolia).

add the perfect search engine algolia xxl

The default search engine you’ll get from WordPress is decent. It does the job but it’s not that great. If you’re familiar with smooth autocomplete search forms, you expect more than the old school “hit search” which displays a bunch of results in a static list. Introducing Algolia, a product focused on providing an outstanding search UX (disclaimer: it’s not a paid feature, I’m a real fan ;-)).

Algolia is very easy to implement.

First of all create a free account on Algolia.com. You can skip all tutorials, their WordPress integration doesn’t require any special knowledge. After signing up, jump straight to the API keys section in the side menu. That’s where you’ll find (on the right, here hidden) the 3 credentials you’ll need for the 1-minute setup on WordPress.

algolia wordpress

Then, on your site, simply install and activate the Search by Algolia plugin from the WordPress repository.

Search by Algolia WP Plugin

After activating the plugin, jump to the Settings via the dashboard sidebar, copy the info from Algolia’s API keys section and paste it there.

Hit “save changes”.

You’re good to go. Just insert the default Search module from your WordPress theme wherever you want, which will now use the Algolia magic behind the scenes to deliver a gorgeous autocomplete experience.

Here’s the full installation guide from the developer.

Additionally you can determine how the results / search page will look like (if you hit “enter” or click/tap on the search button).

I like the third option (Use Algolia with Instantsearch.js).

But I’m not a fan of the default look n feel of that page (see below) with a sidebar featuring some cryptic info and all the tags attached to my posts. So I use a little CSS snippet (inserted via “additional CSS” in the website customizer) to hide the sidebar (see the adapted page below).

#ais-facets
{
display:none;
}
before default algolia screen
Before, the default version.
after algolia screen
After applying the CSS modification.

You will see results changing in real time when you type something in the search bar.

The cool thing about Algolia is that they will show you which search queries are typed on your site, a nice way to see what’s popular (and also which content you should create in the event of unsuccessful queries). Algolia stays free as long as you don’t have more than 10K records and 100K operations (record updates & queries) + display their logo. It should be fine for a personal blog.

🚀 Subscribe to my weekly newsletter packed with tips & tricks around AI, SEO, coding and smart automations

☕️ If you found this piece helpful, you can buy me coffee