Every element of your search form matters, doesn’t it? This tutorial features how you can customize the default message in case there are no search results found.
Tutorial requirements:
- JetSearch — apply the fastest AJAX search and manage the way the results are displayed, using advanced stylization settings;
- WordPress Gutenberg editor and JetStyleManager — style any Gutenberg block & adjust its visual rendition;
- Elementor free — add the necessary widget into the editor, style it up, and publish it right away.
Setting New Notification Messages in Elementor
Step 1 — Open the page where you added the AJAX search widget with the Elementor editor.
Step 2 — Select the AJAX Search widget and proceed to the Content tab. Unfold the Notifications section.
Here you can see that default notification text which is usually applied.
Step 3 — Now, enter the new notification and click the “Update” button.
Step 4 — You can also style this message by proceeding to the Style > Notifications tab in the Elementor editor.
Choose the typography of the notification. Also, you can set the color, adjust the alignment, and add paddings to the notification.
Step 5 — Don’t forget to update the changes.
Check how it looks on the front end. Type in something you don’t have on your site in the search box and view the message you have just created.
Styling the Notification Message in Gutenberg
JetSearch works not only with the Elementor page builder. This plugin allows applying a Search block using Gutenberg as well.
Open the page in the default WordPress editor. Click on the “Add block” button and find the AJAX Search block.
Unfold the Notifications section to customize the content of the Negative search results and Technical error messages.
You can style the AJAX Search block with the help of the JetStyleManager plugin.
Click on the “Block Style” button in the upper right corner of the editing window.
Unfold the Notifications section and style up the messages according to your needs.
After completing all customizations, click the “Update” button and preview your notification messages on the front end.
Now you know how to change and style up the notifications shown when nothing was found with the help of the JetSearch plugin.