SearchWP Blog

Do you want to add a search form to your shop page in WooCommerce?

Adding a powerful search form to your shop page will help your site visitors navigate your store faster and get the results they’re looking for. You can easily get more sales and boost customer satisfaction this way.

In this article, we’ll show you how to add a search form to your WooCommerce shop page the easy way.

Why Add a Search Form to Your Shop Page?

Site search is a common feature online shoppers use to navigate eCommerce websites. At least 30% of your store visitors are using the search box if your site already offers one. Adding a search form to your shop page will help them find your products even faster.

These days, site search is an important part of every successful eCommerce strategy. It’s a major source of revenue as shoppers who use search are more likely to buy from you than those who don’t.

Site search is often more difficult in larger stores. Site visitors tend to spend more time looking for the products they need. You can make things easier by adding search to specific locations of your store. This will help you increase your conversion rates.

You can add a search form to different locations of your site like the sidebar and the header. But adding one to your shop page (especially at the top) makes it easier to find.

On most mobile devices, your users will need to scroll for a while to find the sidebar. A search form in the header or menu can also go unnoticed in some cases. If you want to make your search form more accessible, you should consider adding it to your shop page.

Adding a search form to your shop page isn’t enough — you also have to make sure your search form is fast and functional.

WooCommerce offers a search feature by default. But if you have a medium or large site, you’ll need a better solution. The default WooCommerce search is slow and doesn’t always give relevant results. This means most of your site users won’t be able to find what they’re looking for.

Want to add a powerful and fast search form to your WooCommerce shop page, even if you’re not tech-savvy?

Below, we’ll show you how to easily do this without writing a single line of code.

How to Add a Search Form to Your WooCommerce Shop Page

Do you want to add a fully featured WooCommerce search form to your shop page? You can use a WordPress plugin like SearchWP. This method lets you offer your users a lot of functionalities without the need to write any code.

SearchWP is a leading WordPress search plugin. It has all the search features your WooCommerce site users need. Unlike the default WooCommerce search, they can use it to find any product or post.

SearchWP indexes all your product attributes like variations, categories, and tags. This means your users can now find a product by simply typing any of its attributes in the search bar.

Other awesome features you get include:

• Exclude attributes in results. If you choose, you can exclude certain product attributes so SearchWP doesn’t show results for them.
• Search insights and statistics. With SearchWP, you can now log searches. This way, you’ll learn what your users are searching for. You can then use the statistics gathered to serve them better.
• Search advanced custom fields. Custom fields are good for storing more information about your site content. Your search engine will no longer ignore them when visitors use the search feature.

Once you install and activate the plugin, it automatically integrates with the native WooCommerce search. So, you can easily add a search bar to any location on your site with the block editor.

We’ll show you how to do this now.

Step 1: Install and Activate SearchWP

The first step to adding a search form to your WooCommerce shop page is to grab a copy of the SearchWP plugin here.

To get access to the WooCommerce search feature, you’ll need either the Pro or Agency license. Make sure you choose any of these plans when getting SearchWP.

If you own 1-5 websites, then the Pro license plan is for you. The Agency plan is more suited for enterprises with over 5 websites.

Once you’ve gotten your copy of SearchWP, you’ll find 2 links for downloading different versions of the plugin. For the best performance possible, we recommend downloading the later version.

You’ll also receive a license key in your registered email. You can save this key to a notepad for reference in the future.

Next, you need to log into your WordPress admin dashboard to upload and set up the plugin.

If you need some help doing this, check out this detailed guide on how to install a WordPress plugin.

Now that you’ve installed and activated SearchWP, you’ll see a new navigation link at the top panel of your WordPress dashboard. Click this link to go to the SearchWP settings page.

This is where you activate your plugin license. Navigate to the License tab and type in the license key from the email sent earlier. Then click the Activate button.

Congrats! Your SearchWP plugin is now ready for use.

Now, let’s look at how to use it to power your WooCommerce search.

Step 2: Install and Activate the SearchWP WooCommerce Extension

The SearchWP WooCommerce search feature comes as a separate functionality. You need to download an additional extension to use it.

With your Pro or Agency license, you can start using the extension immediately. So, simply download the SearchWP WooCommerce add-on for free here.

Once you’ve downloaded the extension, upload it to your WordPress site. You can follow the same steps in the previous section to do this.

This will automatically add all the advanced WooCommerce search features to your native search fields.

The next thing you need to do is set up your first SearchWP search engine.

Step 3: Set Up a New SearchWP Search Engine

SearchWP gives you a lot of control over how your users look for content on your site. You can select from a list of sources and adjust the relevance of each attribute.

To make sure your store visitors can find products on your shop page, you need to add products as a source in the search engine.

To do this, go to the settings page by clicking SearchWP in your WordPress dashboard.

On the next page, you get the option to edit the default search engine or create a new one. Click Add New to create a new search engine.

To add products as a search engine source, click Sources & Settings.

Now, make sure you tick the Products box from the list of sources available. You can also combine with other sources depending on your preference. Then click Done.

After selecting products as a source, scroll down to the newly added Products tab and click Add/Remove Attributes.

Here, you can choose to index any product attribute like the title, slug, or short description.

You can further improve your WooCommerce search with custom fields and taxonomies. This will let your users find products with attributes like tags, variations, and shipping classes.

For example, a user may want to find all products tagged ‘interior’ in your store.

Once you’re done choosing product attributes and adjusting their relevance, click Done.

Next, click Save Engines. SearchWP will apply the new settings by rebuilding your search index.

Next, let’s add the search form to your shop page.

Step 4: Add a Search Form to Your Shop Page

Using the block editor, you can add a search form to any page in your WordPress site. We’ll add one to your shop page now.

First you need to find your shop page by going to Pages » All Pages.

Next, find the Shop page. Hover over it with your mouse, then click Edit.

Click the + icon to add a new block to the shop page.

Type search in the search bar and select the Search icon.

Next click Update to save your new settings.

Now, when your users visit your shop page, they can easily search for the products they want.

In this article, you’ve learned how to add a search form to your WooCommerce search page with SearchWP.

Your site visitors can now easily search for the products they need while browsing your shop page.

If you’re ready to add a search form to your shop page, start by getting your copy of SearchWP.

You may also want to check out our guide on how to add a custom WooCommerce search widget.