Fraud Blocker
  • Home
  • Products
  • Support
  • Blog
  • Contact

Table Of Contents

Elementor Search plugin

How to Use Elementor Search Plugin

Here, you’re going to know how to Use the Elementor Search plugin to make a search bar. As the search bar is the location within a browser that allows visitors to search the site for what they may be interested in finding, you can do the task of making the search bar easily. For that, you wouldn’t need to have any coding knowledge.

So, let’s start.

To Insert Widget

inserting the Elementor Search plugin

Inserting widget, it is just a matter of drag and dropping. As you see in the screenshot above.

Content Tab

Using the content tab, you’ll be able to make a layout of a particular part (option be added) of a website. And in this regard, some handy sections in the tab will assist you a lot.

Search Layout

search bar layout settings

Simply, go to the Content tab > Search Layout.

In this section, you can define the layout of the search bar. From here with the default skin, you’ll be able to set Skin (Dropdown, Dropbar, Modal).

Another important thing is a Specific Post Type that will allow you to set the posts of different types such as Posts, Pages, portfolios, Products, etc.

There is one more thing is Placeholder that allows you to set a placeholder (Search).

In addition switcher button controllers namely Search Icon, Icon Flip, Ajax Search.

Style Tab

Now, let’s work with the Style Tab. The tab will confidently have you style the web content (text, image, video, etc.) of the page you require to design. 

Styling with the Style tab in Elementor will always give you a fantastic experience.

Let’s have a look.

Search Container

Elementor Search plugin container style

If you feel to have a background in the search layout, you can easily do that. Just go to the Style tab > Search Container to customize the Elementor search widget.

N.B: In terms of different Skin you will find the Search Container with controls/ options for the individual design.


Elementor search widget input style

Simply, go to the Style tab > Input.

This section will allow you to style the input field both in the Normal and Focus mode. As you can see in the screenshot.

In addition, you the Icon size and color.

Toggle Icon

Elementor Search plugin toggle icon style

This section will let you style the toggle icon. The important thing is that you have to make sure the Skin (Dropbar, Dropdown, or Modal except the default one) is from the Search Layout for the search box.

Simply, go to the Style tab > Toggle Icon.

Video Assist

I want to draw your attention it seems you’ve noticed that there are some super cool Skins for getting a unique look at the search bar. In addition, you’ve seen how to use our Advanced Button Widget by Element Pack. Watch Video Assist and to get more ideas about the usage of this widget, visit the demo page here.

Take advantage of fine-tuned plugins

Get Customizable Elementor Widgets to Power Up Your Website

Take advantage of fine-tuned plugins to speed up web projects without sacrificing quality. We offer a 30-days money-back guarantee.

BdThemes is the sole owner of #1 market-leading addons for Elementor such as Element Pack Pro, Prime Slider, Ultimate Post Kit, Ultimate Store Kit, Pixel Gallery, and more useful plugins.

This website is powered by Element Pack Pro and Rooten Theme.

New Year Sales Are Giving up to ~70% Price Off!! on our products | Coupon: HNY2023

Need any assistance? Call Us:+880 1700 55 95 95

Copyright © 2023 BdThemes. All Rights Reserved.