Store headers
Help shoppers jump straight to a product.
Commerce / widget · Elementor module
Store Product Search Form Widget Plugin for Elementor
Add a WooCommerce product search with a label, an optional category picker and suggestions of matching products, with images and prices, as shoppers type.
Included in All AccessClassic Elementor widgetFrom $29 USD / year
Complementor / Store product search formProduct preview
Text, style and layout controls inside Elementor
01 / Interactive demonstration
Try it
These are the actual published widgets searching the demo store; type to see suggestions.
02 / Inside WordPress
Store product search form controls in Elementor
Search sets the label and whether it shows, the placeholder, button text and a text or icon button, a category picker, suggestions with their number, prices and images, and an icon in the field. The Style tab covers the text and surface, the icon, and the field, button and highlighted suggestion colours with the corner radius.
03 / Website use cases
Where to use store product search form
A plain search box makes shoppers type a full word, submit and wait to find out whether the store sells it. Store product search form suggests matching products, with their images and prices, as soon as two letters are typed, lets shoppers narrow by category, works fully with the keyboard and screen readers, and still searches WooCommerce products normally when scripts are off.
Large catalogues
Narrow searches by category.
Landing pages
Offer a search where visitors arrive.
04 / Installation and setup
How to add a product search with suggestions in Elementor
Start with Complementor installed and your license connected. Enable this module in the WordPress library, then configure it in Elementor.
Install WooCommerce and Complementor, connect your license and enable Store product search form in the Complementor library.
Add the widget to your header, shop or landing page.
Write the label, placeholder and button text, or choose an icon button.
Turn on the category picker and choose how many suggestions show.
Style the field, button and highlighted suggestion.
05 / Content and style controls
Customize store product search form in Elementor
Configure the settings available for this module to suit the page you are building.
Suggestions of matching products with images and prices as shoppers type.
An optional category picker that also narrows the suggestions.
A visible label, or one for screen readers only.
A text or search-icon button.
Full keyboard use: arrows to choose, Enter to open, Escape to close.
A plain WooCommerce product search when scripts are off.
06 / Choose the right approach
Store product search form and Elementor alternatives
Compare the existing Elementor workflow with this Complementor module before choosing your setup.
Store shop link
A link or button to the shop or a category.
Store cart link
A cart link with the item count and total.
07 / Requirements and compatibility
Store product search form compatibility with Elementor
- Requires Elementor and WooCommerce.
- Suggestions use this site’s WooCommerce Store API product search; results open on WooCommerce’s product search page.
- Up to 10 suggestions.
Complementor uses classic Elementor APIs. Atomic-native controls are not implemented. Check your theme, cache and integrations on a staging site before release.
08 / Common setup problems
Troubleshoot store product search form
Check these settings if the published page behaves differently from the editor.
Why do no suggestions appear?
Type at least two letters. Suggestions come from WooCommerce’s Store API; if a security plugin blocks it, the form still searches normally.
Why is a product missing from suggestions?
Only published products shown in the catalogue are suggested, up to the number you choose; See all results lists every match.
Why does the category picker not show?
It lists product categories that contain products; with none, it is left out.
Store product search form plugin questions
Does it need Elementor Pro?
No. It works with the free version of Elementor and WooCommerce.
Where do suggestions come from?
From your own site’s WooCommerce Store API; nothing is sent elsewhere.
Can shoppers use the keyboard?
Yes. Arrow keys move through suggestions, Enter opens one and Escape closes the list.
Does it work without JavaScript?
Yes. It is a normal search form that shows WooCommerce’s product results.
Can I hide the label?
Yes. Keep it for screen readers only and use the placeholder as the visible hint.
10 / Annual All Access subscription
Get store product search form with Complementor
This module is included with all 1007 current Complementor solutions. Choose your production website allowance; every plan includes the same modules.
One website
$29USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $29 USD each year.
A few websites
$49USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $49 USD each year.
More websites
$99USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $99 USD each year.
Applicable taxes extra. Annual subscriptions renew automatically unless canceled in your customer account. Elementor Pro is required for Exclude current post. Read the terms and 14-day technical-issue refund policy.