Open WR Live Search

Product Live Search is a built-in plugin for Nitro theme package. This plugin allows you to instantly show matched search queries when typing words into the search box. By using this plugin, people don’t have to finish a completed word, or enter the full search result page to find what matched what they has typed so far.
To open Product Live Search, click on Dashboard > Settings > WR Live Search.

Display Live Search

There are 2 ways to display a Live Search box: using shortcode and use “search” element on Header Builder.

Using shortcode

By using shortcode, you can add Live Search anywhere you like.

To add a Live Search on a specific page, use this shortcode:

 

You can also use this PHP function to display search bar:

 

This is how Product Live Search appears on your specific page.

 

Please notice that unlike PHP function, the shortcode is changed due to changes in live search configurations. Therefore, if you choose using shortcode, you have to finish configuring live search options, then copy the generate shortcode to where you want to display live search bar.

 

Using “search” element on Header Builder

Another way to display shortcode is enabling “Live Search” on your default header on Header Builder. Enabling “Live Search” for your default header via Header Builder also means you can also display Product Live Search on all your pages (except those which don’t use global page settings).

Please notice that if you turn off global page settings for a page, you can no longer display Live Search on that page via Header Builder.

Go to Dashboard > Nitro > Header Builder, then choose your default header.

Then click on current “Search” element, or drag to add a “Search” element (if your default header hasn’t had “Search” element yet). On “General” tab, tick the checkbox “live search” to turn on live search for this “Search” element. Then you can see all settings for Product Live Search here.

 

Configure WR Live Search

There are 2 ways to configure Product Live Search: via WR Live Search plugin settings, and via “search” element on Header Builder.

Via WR Live Search plugin settings

The first way to customize Product Live search is by getting into plugin settings page of this plugin at Dashboard > Settings > Live Search.

These are all settings for Product Live Search on Product Live Search plugin settings. Here you can see that there are 2 main areas: shortcode/PHP function, and customization fields.

Save and update settings

There are 2 ways to update settings for live search bar: using shortcode and PHP function. You can see this 2 types of code on the top of settings screen. To display live search bar, you just have to choose one type of code, either shortcode or PHP function.

Using PHP function

By using PHP function, you don’t have to update code whenever there are changes made on settings. To add live search bar with PHP function, open your function.php file on your site database, then paste the PHP function code to where you want to display your live search bar.

 

Using shortcode

By using this shortcode, you will have to update shortcode whenever there are changes made on settings.
All these settings will be autogenerated on the shortcode on the top of this screen.

To save any changes, click on “Save Changes” at the bottom, a new shortcode will be generated.

An alternative way to help you add live search bar by shortcode without changing new codes upon update is by using the dynamic shortcode:

Customization fields

 

Here you can customize fields for the Live Search bar.

Options:

• Placeholder: enter a search term suggestion
• Show button: show or hide search button
• Show category list: show a drop-down product category list
• Show suggestion: display or hide search term suggestion
• Minimum number of characters: enter the minimum number of characters for a search term
• Maximum number of results: enter the maximum number of characters for a search term
• Search in: choose data range for live search