How Can We Help You?

Search Box

How To Use A Search Box Of UBE Addons

Search Box let your website users quickly search through your website content is very important. A search form helps you achieve it. The user will enter a keyword and click the search button and it will yield results in front of the user’s screen quickly..

Using Search Box:

You can see the below video to get an insight into how you can use the Search Box Widget to create beautiful designs. Or you can follow the documentation whichever you find convenient.

How to Activate Search Box

To use this UBE Addons element, find the Search Box‘ element from the Search option under the ELEMENTS tab. Simply just Drag & Drop the Search Box into the Drag widget here‘ or the ‘+’ section.

How to Configure Content Settings

Under the ‘Content’ tab, you will find the Search Box sections.

Search

Style Choose style of search box
Placeholder text Enter placeholder text to input of search box
Height Enter height of search box ( include input and button)
Button Type Choose content button is text or icon
Icon Select the icon of button if Button Type is icon
Search Button Text Enter text of button if Button Type is text

Ajax Search

Enable Search Ajax Is it possible to search with ajax?
Enable Result Date Is it possible to show the date of the post in the results?
Amount Of Search Result The maximum posts show up in the results
Order by Choose order by of post
Order Choose order of post

How to Style Search Box

Switch to the ‘Style’ tab to style all the elements of Search Box.

Input

‘Input’ section lets you choose Text Color, Placeholder Color, Typography, Background Type, Padding, Margin, Border Type, Border Radius to the Input of Search Box

Submit Button

‘Submit Button’ section lets you choose Width, Border Type, Padding, Border Radius, Typography; Text Color, Background Type in normal and hover mode to the submit button of search form.

Result Ajax

‘Result Ajax’ section lets you choose Background Type, Padding, Margin to the result box of ajax search.

‘Image’ section lets you choose Width, Margin to the result item of ajax search.

‘Title’ section lets you choose Text Color, Typography to the title of ajax search item.

‘Date’ section lets you choose Text Color, Typography to the date of ajax search item.

Final Outcome

By following these mentioned steps and a bit more modifying & styling, you can easily design your Search Box as per your preference.

By using UBE Search Box, this is how you can easily put the spotlight on your significant contents & make them appealing to your visitors.

Getting stuck? Feel to Contact Our Support for further assistance.

Contents