|

Advance Search

Advanced Search for Elementor

The Advanced Search widget in Ultimate Addons for Elementor allows you to create powerful, AJAX-powered live search functionality on your website. It supports multiple post types, taxonomy-based search, trending searches, sorting, load more pagination, and advanced filtering, all without page reload.

Overview

The Advanced Search widget helps users instantly find relevant content across your website. It supports:

  • Live AJAX search
  • Multiple layout options
  • Search across posts, pages, CPTs & media
  • Taxonomy-based search (categories, tags, custom taxonomies)
  • Trending search suggestions
  • Load More pagination
  • Sorting & performance optimization controls

How to Add the Widget

Follow these simple steps:

  • Edit your page with Elementor
  • Search for Advanced Search in the widgets panel
Advance Search 461x1024
  • Drag and drop it onto the page
  • Customize using the Content and Style tabs

That’s it, your advanced search is ready in seconds.

Content Tab Settings

1. Search Box

Configure how the search interface appears.

Layout Options

Choose from:

  • Input Box – Displays only the search input field.
  • Icon – Displays a search icon that expands on click.
  • Input Box with Button – Displays an input field with a button.
Layout Options Scaled

Placeholder – The text inside the search bar can be defined here. (Maximum 50 characters to avoid overlapping issues with Icon)

Button Settings (Input Box with Button layout)

  • Button Text
  • Button Icon
  • Icon Position (Before / After text)

Icon Settings (Icon layout)

  • Show/Hide Icon
  • Icon Position (Left / Right)

2. Trending Searches

Display suggested search terms before the user starts typing.

Enable Trending Searches and configure:

  • Heading text
  • Comma-separated search terms
    Example: WordPress, Elementor, Plugins
Trending Search Scaled

3. Content Sources

Choose what content should be searchable.

Select Search Sources

You can search across:

  • Posts
  • Pages
  • Custom Post Types
  • Media (attachments)

Certain system post types are automatically excluded for security and performance reasons.

Enable Taxonomy Search

Allow users to search by:

  • Categories
  • Tags
  • Custom taxonomies
Content Sources 1 Scaled

4. Layout Settings

Control how results appear.

Layout Type

  • List (Rows)
  • Grid (Columns)

Initial Items Count – Number of results shown initially (1–20).

Featured Image – Show or hide post thumbnails.

Results Counter – Display total results using:

Found [count] Results([count] dynamically updates.)

Load More – Enable Load More to display additional results without reloading the page.

You can configure:

  • Results per load
  • Button text

No Results Message – Customize the message shown when no results are found.

Layout Settings Scaled

5. Enhanced Search Features

Enable advanced performance and sorting controls.

Advanced Search Features (Master Toggle)

When enabled, you can configure:

Sort Results By

  • Relevance
  • Date (Newest / Oldest)
  • Title (A–Z / Z–A)
  • Most Commented
  • Recently Modified
  • Menu Order

Minimum Search Length

Minimum characters required before search triggers.

Search Delay (Debounce)

Set delay in milliseconds (100–2000ms) to prevent excessive AJAX requests.Default: 300ms

Enhanced Search Features Scaled

Style Tab Settings

The Style tab allows full customization of the search interface.

Style Tab Scaled

Search Box Styling

Customize:

  • Typography
  • Height
  • Text Color
  • Placeholder Color
  • Background
  • Border & Radius
  • Box Shadow
  • Focus State styling

Button Styling

(Available in “Input Box with Button” layout)

Customize:

  • Text & Icon color
  • Background (Classic / Gradient)
  • Hover colors
  • Width
  • Icon size & spacing

Icon Styling

(Available in “Icon” layout)

Customize:

  • Icon color
  • Hover color
  • Icon size

Results Container

Style the dropdown results area:

  • Background
  • Padding
  • Border
  • Border Radius
  • Box Shadow

Trending Searches Styling

Customize:

  • Heading typography & color
  • Badge text & background
  • Hover styles
  • Border radius
  • Spacing & layout (Inline / Block)

Load More Button Styling

(Need to enable the Load More functionality)

Customize:

  • Text color
  • Background
  • Hover styles
  • Typography
  • Padding
  • Border & Radius
  • Alignment
  • Hover animations

Troubleshooting

Search Not Triggering?

  • Ensure minimum search length is met.
  • Check if Advanced Features are enabled (if using sorting).

No Results Found?

  • Verify selected post types under Content Sources.
  • Ensure posts are published.
  • Confirm taxonomy terms exist if using taxonomy search.

Load More Not Working?

  • Make sure it is enabled under Layout settings.
  • Check console for JavaScript conflicts.
Was this doc helpful?
What went wrong?

We don't respond to the article feedback, we use it to improve our support content.

On this page
Scroll to Top