Docs

Search Products Pro Documentation

1. Introduction

Hi! I’m the best search bar for WooCommerce! I can find any product easy and quicker than my competitors. Your conversion rates will improve! Give it a try, it’s simple!

2. Installation

To install Search Products PRO plugin follow the steps below.

  • In your WordPress Dashboard navigate Plugins
  • Click Install Plugins and then click Add New
  • Click the Upload Plugin button
  • Upload the plugin ZIP file that you’ve downloaded from WooCommerce.com and click OK
  • Click Install Plugin to start the installation
  • When installation is complete, click Activate
  • Plugin is now active and you can use it!

3. Automatic updates

Automatic updates are available thru WooCommerce.org service. You will be notified in Plugins section of your WordPress Dashboard about the new version. We advise to keep yours at the latest version. Security and reliability wise that is the best solution. You can turn on the automatic updates for this plugin too, if you want to make us care about the updates.

4. Search bar elements

Search Products PRO bar is initiated with a shortcode or a page builder widget/element. You can put the search bar anywhere on the website! Popular header and footer builders allow use of this element in website structure too.

4.1 Shortcode

Shortcode is the most basic way of using the plugin. To output Search Products PRO bar element input following shortcode in the content builder.

4.2 Shortcode parameters explained

4.2.1 Modal search

Search Products PRO element can appear as a modal search. When activated like so, it’ll show a trigger icon which can bring up the modal with search input. Inside this modal search results will appear.

Additionally you can set the modal trigger icon by setting the iconcallout=”” parameter. The value is URL of an image to use for replacement.

To get search in modal, use the following shortcode.

Following shortcode outputs the search products bar default element:

[search_products_pro]

Supported shortcode parameters:

id=""
class=""
category=""       // category slug, multiple separated with comma
position=""       // "fixed" or "static"
size=""           // "sm", "md" or "lg"
categorytree=""   // "-1" full, "0" no category tree, "1" 1st level, "2" 2nd level, "3" 3rd level
showprice=""      // "yes" or "no"
showimage=""      // "yes" or "no"
showterms=""      // "yes" or "no"
theme=""          // theme name from the settings
callout=""        // this is actually modal "yes" or "no"
iconcallout=""    // url for the trigger modal icon replacement
iconsearch=""     // url for the search icon replacement
iconx=""          // url for the dismiss icon replacement
chartosearch=""   // characters to search e.g. "2" or "3"
limit=""          // limit products to show. e.g. "10"
placeholder=""    // replace search input placeholder text
notfound=""       // replace not found results text
catseparator=""   // replace category separator e.g. ">"
Following shortcode outputs the search products bar element:

[search_products_pro callout="yes"]

4.2.2 Fixed position

Search Products PRO element can display results in two ways.

  1. Static positioning
  2. Fixed positioning

Difference between the two methods follow. Static positioned results element will pus the content below it down as the results fill in.

Fixed positioned element  shows results “fixed” just below the search bar. Content will not be pushed and the results will appear “on top”.

To choose position and show use the following shortcode parameter.

Following shortcode outputs the search products bar element with fixed position:

[search_products_pro position="fixed"]

4.3 Elementor widget

If you use Elementor or Elementor PRO page builders for WordPress, we’ve included the Search Products PRO widget. Find it in the General section or just type the Search Products PRO in the search widget field.

Drag and drop element to your page and set a few options if you prefer.

If you want to use the Call out method make sure you select it from the Element method dropdown.

To search within a category type in the category slug in Category field. ID and Class can add customized ID and class parameters to element if needed.

4.4 WPBakery Page Builder

If you use WPBakery Page Builder for WordPress, we’ve included the Search Products PRO element. It’s named  Search Products PRO.

If you want to use the Call out method make sure you select it from the Element method dropdown.

To search within a category type in the category slug in Category field. ID and Class can add customized ID and class parameters to element if needed.

4.5 Gutenberg

To use with Gutenberg follow these simple steps.

  1. Click Plus button to add element and search for Shortcode
In the field enter

[search_products_pro]
If you want to add a call out method element use the following shortcode.

[search_products_pro callout="yes"]
If you want to limit search within a category.

[search_products_pro callout="yes" category="my-category-slug"]

4.6 Cornerstore

To use with Cornerstone page builder follow these simple steps.

  1. Click Plus button to add element and search for Shortcode
In the field enter

[search_products_pro]
If you want to add a call out method element use the following shortcode.

[search_products_pro callout="yes"]
If you want to limit search within a category.

[search_products_pro callout="yes" category="my-category-slug"]

4.7 AVADA Fusion builder

To use with AVADA Fusion follow these simple steps.

  1. Click Plus button to add element and search for Shortcode
In the field enter

[search_products_pro]
If you want to add a call out method element use the following shortcode.

[search_products_pro callout="yes"]
If you want to limit search within a category.

[search_products_pro callout="yes" category="my-category-slug"]

4.8 Divi builder

To use with Divi builder follow these simple steps.

  1. Click Plus button to add element and search for Shortcode
In the field enter

[search_products_pro]
If you want to add a call out method element use the following shortcode.

[search_products_pro callout="yes"]
If you want to limit search within a category.

[search_products_pro callout="yes" category="my-category-slug"]

5. Plugin settings page

Search Products PRO Dashboard. Export, Import, Backup, Restore and Reset plugin options is available.

Search by Categories, by Attributes, by Tags, by Colors, by Brands, by Custom Taxonomies, by anything you can think of!

Product SKU search options. SKU compare EXACT (IN) or LIKE (LIKE) SQL methods.

Add custom meta keys to search in them. You can even search by price with our bar. Advanced Custom Fields is supported!

Customize the full look of the Search Products PRO element.

More advanced options on the element can be se. Trigger how many characters will make a search. Products to display sets the max amount of products to return by the AJAX search query. Category separator can be customized too.

6. Contact support desk

Hey! Need help? Send us a message here and we’ll get in touch quickly!

    Search Products PRO for WooCommerce

    Amazingly crafted search widgets and elements for any WooCommerce Shop.