Animation Addons

Animation Addons

Dynamic Widgets

Search No Result

Estimated reading: 4 minutes 47 views

Before setting up the Search No Result Widget, make sure that the Animation Addons for Elementor plugin is installed and activated on your site. Once activated, you’ll have access to all free Elementor widgets, including the Search No Result Widget —at no cost! Additionally, you can explore both free and pro widgets by filtering the selection options.

Search No Result 1

Introduction

The Animated Text Widget adds dynamic effects like fade, slide, and bounce to text, boosting visual appeal with ease.

Key Use Cases for the Search No Result Widget in Elementor:

  • Display a helpful message when no search results are found.
  • Customize the message to guide users towards other content or actions.
  • Enhance user experience by offering alternative suggestions or links.

Prerequisite

  • Elementor
  • Animation Addons for Elementor

How to Activate the Search No Result Widget?

  • Go to Animation Addons → Elements in your WordPress dashboard.
  • Find the Search No Result widget in the list.
  • Toggle it on to enable the widget.

Now, the Search No Result widget is ready to use!

Search No Result 2

How to Add Search No Result Widget in Elementor

  • Open the page where you want to add the Archive Title Widget.
  • Launch the Elementor editor.
  • In the Elementor panel, search for “Archive Title Widget.”
  • Drag the widget to your desired section.
  • The Archive Title widget is now ready for customization.

How to Configure Search No Result Widget

Enable the widget, create a new page, set a title, choose the Elementor Full Width template, and publish the page.

  • Adjust the page settings as needed.
  • In the Elementor panel, search for the “Search No Result Widget.”
  • Drag and drop the widget into your desired section.
  • This widget will automatically display a custom message when a search returns no results, enhancing user experience by guiding them clearly when nothing is found.
Search No Result 3

Configuring Search No Result Widget : A Step-by-Step Guide

Once the Search No Result Widget is added to your page, you can configure its settings under different tabs: Content,Style and Advanced.

Search No Result 4

Content Settings

The Content section of the Search No Result Widget allows full customization of the message displayed when no search results are found. The available configuration options include:

Search No Result 5
  • Search Title: Define the heading that appears when no results are returned. This helps users understand that their search yielded no matches.
  • Title HTML Tag: Choose from 7 HTML heading tags (H1–H6 and DIV) to determine the semantic importance of the title. This is essential for accessibility and SEO optimization.
  • Search Content: Add supporting text or guidance using a rich text editor. You can include:
    • Media: Insert images or videos to make the message more engaging.
    • Visual/Text (Code) Mode: Switch between a visual editor for basic formatting and code mode for custom HTML.
    • Paragraphs: Write clear, user-friendly messages that guide users on what to do next (try another keyword, check spelling).

These settings help maintain a consistent user experience and ensure that users are clearly informed when their query doesn’t return any content.

Style Settings

The Style section provides options for customizing the appearance of both the title and content of the Search No Result Widget. These options allow for complete control over the visual presentation.

Search No Result 6

Title Settings

The Title section allows you to customize the heading that appears when no search results are found:

Search No Result 7
  • Text Color: Adjust the color of the title text to match your website’s design scheme.
  • Typography: Control the font family, size, weight, line height, and letter spacing to ensure the title is visually prominent and aligned with the overall theme.
  • Text Stroke: Apply an outline effect around the title text for enhanced visibility and emphasis.
  • Text Shadow: Add a shadow behind the title to create depth and a more dynamic appearance.
  • Spacing: Set the spacing (margin and padding) around the title to control its positioning within the widget.

Content Settings

The Content section allows you to style the body of the message displayed when no results are found:

Search No Result 8
  • Text Color: Choose the color of the content text to maintain readability and consistency with the page’s color scheme.
  • Typography: Adjust font size, weight, family, line height, and letter spacing to ensure the content text is legible and well-aligned with the title.

These style settings offer flexibility to tailor the widget’s appearance to fit your website’s design, ensuring it provides a seamless and visually appealing user experience.

Advanced Settings

In the advanced settings, you’ll find a variety of advanced features designed to enhance your designs. Experiment with these options and experience the difference they make.

Search No Result 9

Final Outcome

That’s it! You’ve successfully learned how to configure the Search No Result widget in Elementor to display a customized message when no search results are found.

For any further assistance or inquiries, feel free to contact our support team!

Share this Doc

Search No Result

Or copy link

CONTENTS