Resource icon

Customizing the Product Search Results Page in WooCommerce: A Complete Guide

WooCommerce comes with an in-built search engine that allows users to search for specific products. While it is obviously helpful, there are some clear drawbacks.

For example, the default search engine algorithm only looks at the title, content, and experts when returning a search result. It skips the custom fields altogether. But what if you’ve added relevant information in those fields? The relevant products might not show up in a product search results page.

In such cases, you need to customize the search results page to display correct products. In this article, learn how you can do that in WooCommerce.

Install SearchWP Plugin

As already mentioned, WooCommerce skips the information available in the custom fields. So to customize the product search results page, you need to make this data searchable so that it gets listed in the results page.

To make this possible, you need to install and use the Search WP Plugin. It’s a powerful plugin that allows you to completely revamp and change the search results page. So go ahead and download it from the plugins directory.

Once installed and activated, navigate to SearchWP > Settings. There, open the Support tab and provide the license key. You must purchase a paid plan to unlock the full functionality of this plugin.

Then, you need to activate the WooCommerce Integration extension. It’s available from your account area in the SearchWP website. After you install it, SeachWP plugin is ready to be used.

Here are the steps you need to follow:
  • Go to SearchWP > Settings
  • Then go to the Engines tab and click on ‘Sources & Settings
  • When a popup appears, make sure to tick the checkbox next to ‘Products’. If you want to make the comments searchable too, then tick the checkbox that reads ‘Comments
  • Click on ‘Done’ to save the changes
  • Scroll down to ‘Products’ section. By default, the plugin is only concerned about the product title, content, slug, and the excerpt. To extend the search functionality, you need to click on the ‘Add/Remove Attributes’ button
  • Clicking on the button will display a popup where you can include or exclude specific search fields
  • After you’ve made the changes click on Done to finish up the process
Please note that not all search attributes are created equal. Some have more weights than others. For example, by default, the headlines and descriptions have more weight than excerpts in search. You can adjust the weights by moving the slider next to the attribute.

Hit the ‘Save Engines’ button to apply the changes. The search algorithm will readjust and you’ll see different products on the search results page.

Customizing Search Results Page in WordPress to Display Specific Items

What if you need to show only specific products while excluding others in the search results page? A common scenario is when a few products go out of stock. For this, you have to define rules and parameters for the search.

To define the parameters, you need to navigate into the SearchWP > Products > Edit Rules button. To add new rules, click on the ‘Add Rule’ button. Specify the conditions for the search results and save the changes.

As an example, you can opt to exclude products that are out of stock. For this to happen, click on the drop-down menu and select ‘Exclude entries if’ option. Then, choose ‘Product visibility’ taxonomy and enter ‘outofstock’ in the corresponding field.

You can also add additional conditions as per your requirements. Once you’re done with the changes, click on the ‘Done’ button. Finally, click on ‘Save Engines’ to apply the changes to the search algorithm.

Displaying Product Search Results in Live Mode

Do you know what is Live Search? It’s a functionality that allows you to display the products as they type.

To include this functionality to your WooCommerce store, you need to install and use the SearchWP Live Ajax Lite Search plugin. Once you’ve installed and activated it, the WooCommerce store will start displaying products for the keywords in the search box.

You can further enhance this functionality. For example, you can enable partial matching. When a customer searches for something, the WooCommerce store will display relevant products even when the searcher hasn’t completed typing the whole word.

For this, you need to navigate into SearchWP > Settings and visit the Advanced tab. Here the following options will be available to you:
  • Partial matches
  • Automatic ‘Did you Mean?’ suggestions to help users with misspelled words
  • Quoted/phrase searches that enable users to search with quotes
  • Highlights the search terms in the search results page to help users scan for the products they’re interested in
Enable the options that you’d like your search results page to have. Once done, save the changes and exit. Now when you go back to your WooCommerce store and search for a product, the changes will get reflected in the results page.

So that’s how you customize a product search results page in WooCommerce. In case there are problems, consider updating the software and trying again.
First release
Last update
0.00 star(s) 0 ratings

More resources from kumkumsharma