Search

How to Add Live Search in Elementor Using JetSearch

As web designers, we must surely improve user experience. Adding search feature is one of the ways to contribute to the user experience. When the users land on your site and want to find specific information or content, they usually go to the search field and type the keyword. The users may leave your site if you can’t present a compelling search form. This means you will lose potential business possibilities or visibility.

Adding live search is one way to make your site’s search form look compelling. This article will show you how to add the live search in Elementor using JetSearch.

Steps to Add Live Search in Elementor using JetSearch

Step 1: Install and Activate JetSearch

Until this article is made, Elementor doesn’t have a feature to add the live search by default. So, you’ll need the help of a third-party Elementor add-on. This tutorial uses the Ajax Search widget by the JetSearch add-on.

You can purchase JetSearch for a single plugin or buy a bundle of Crocoblock plugins—download JetSearch on its official website. Please install and activate it once you have downloaded it.

Step 2: Add the Ajax Search Widget

Go to your Elementor editor; you can create new content or select existing content. In this example, we will edit our header template. Which means we will add a live search into a header.

Once you enter the Elementor editor, select the Ajax Search widget from the widget panel and then drag and drop it into the canvas area.

Step 3: Edit and Style up the Ajax Search Widget

Once you add the Ajax Search widget to the canvas area, you can edit and style up the Ajax Search widget with your preference.

In this example, we will apply a few changes as below:

  • Enable the Show Categories List option
  • Set the Taxonomy to Categories

The Bottom Line

The live search brings your search form to the next level. It allows users to see the search results without redirecting to the results page. Elementor and JetSearch will is the perfect combination for creating a live search; seamless and effortless.

JetSearch has four key features as below:

This page may contain affiliate links, which help support our project. Read our affiliate disclosure.
Akbar Padma

Akbar Padma

Akbar is a WordPress expert and a writer staff at WPPagebuilders. He mainly writes about Gutenberg, Elementor, Divi, and other WordPress page builders.
Want to save yearly expense up to $219? why not?

Leave a Comment

Haven’t used Elementor Pro yet?