Help Center
How to Highlight Searched Text in the Results Area

How to Highlight Searched Text in the Results Area

Find out how to highlight the text user searches in the AJAX Search results area available with the JetSearch plugin.

Before you start, check the tutorial requirements:

  • Elementor (Free version) or Block editor (Gutenberg);

  • JetSearch plugin installed and activated.

You can make the search even easier for users by following the described steps. Proceed to the page where the AJAX Search block/widget is located. It can be either Gutenberg or Elementor-made page.

Gutenberg-Edited Page

Once the AJAX Search block is placed on the page, look through the presented settings sections. Move to the Results Area one and enable the Highlight Searched Text toggle.

This one refers to the needed feature. From now on, the searched words will be highlighted in the results area of the AJAX Search.

Press the “Publish/Update” button to save the result. Check the ready page.

ajax search results area in gutenberg

If you enter some text in the search bar, and it turns out that your site has items that contain the searched word, they will be highlighted.

highlighted results on the gutenberg edited page

Elementor-Based Page

The same settings are displayed in the AJAX Search widget added to Elementor. 

Find the Results Area section to see the Highlight Searched Text switcher. Enable it to gain the desired result.

Pay attention to other needed settings in the Content, Style, and Advanced tabs. And once the desired result is achieved, hit the “Publish/Update” button.

ajax search results area in elementor

Now, if you open the page on the front end and type in the search request, you can see that the searched content is highlighted.

highlighted results on the elementor edited page

As you can see, highlighting content in the AJAX Search is pretty simple with the JetSearch plugin.

Was this article helpful?
YesNo

Need help?

Ask Facebook community

Get answers from 22K Crocoblock Community experts from all over the world.

Start a live chat

Ask question to support agent and share its details via chat messages.