SearchWP

News

How to Make Divi Search WooCommerce Products (No Coding)

Want to know how to make Divi search WooCommerce products?

It’s a problem that every WooCommerce store owner who uses Divi as their primary page builder needs to fix if they want to succeed online.

In this tutorial, we’ll show you how to enable search by WooCommerce products on your Divi site in a few simple steps.

Let’s dive into it!

Why Make Divi Search for WooCommerce Products

The default WordPress search engine is rather weak and isn’t the best choice if you’re looking to give your customers the positive user experience.

For example, it doesn’t:

  • consider product attributes when performing a search
  • allow your customers to search by product tags
  • pay attention to the product category
  • look for partial matches if there are no exact ones
  • collect any data on your visitors’ search activity
  • and many more…

The same goes for Divi search modules, as Divi is a pagebuilder plugin that uses the same default WordPress search engine.

Thankfully, there is a way to make search on your WooCommerce site way smarter and help your visitors find the product they’re looking for faster.

Let’s look at how you can do that in just a few clicks, with no need for coding or technical skills.

How to Make Divi Search for WooCommerce Products

The easiest and fastest way to make Divi search for WooCommerce products is to use SearchWP.

SearchWP logo

SearchWP is a beginner-friendly and powerful plugin with many features to help you improve your WordPress search.

It allows you not only to make WooCommerce products searchable but fully customize your search for your business needs.

For example, you can limit your search, enable search by product tags, prioritize specific products in search results, and many more.

More than 30,000 WordPress website owners use SearchWP to deliver their visitors the most relevant search results.

Here are some other features of this plugin that make it so popular:

  • Live search results. Give your customers search results in live mode to help them find what they’re looking for faster and boost your sales.
  • Search activity analytics. Get detailed reports on your visitors’ search behavior to see what search terms they enter, which search results are most popular, and more.
  • Custom search forms. Add multiple custom search engines and connect them to individual search forms across your site.
  • Control over search results. Change the order of search results on your site the way you want to promote specific pages and get more pageviews.

With that, let’s talk about how you can use SearchWP to make Divi search for WooCommerce products.

Step 1: Install and Activate SearchWP

The first thing you need to do is to grab your copy of SearchWP.

Once you’ve got your copy of the plugin, go to your SearchWP account and head to the Downloads tab.

go to the Downloads tab

Then, press the Download SearchWP button and download the plugin’s ZIP file to your computer.

press Download SearchWP

After downloading, copy the plugin license key on the same tab.

copy your license key

Next, you’ll need to upload the SearchWP ZIP file to your site and install the plugin. Check out this detailed tutorial on how to install a WordPress plugin if you need help with that.

After you install the plugin, you’ll need to activate your copy with your license key.

To do that, navigate your WordPress dashboard and click Activate License under the SearchWP button at the top panel.

click Activate License

Next, paste your SearchWP license key into the License field and click Activate.

press the Activate button

After you activate your license, the next step is to install the WooCommerce Integration extension.

Step 2: Install WooCommerce Integration Extension

Using this extension, you can seamlessly integrate SearchWP with WooCommerce and get complete control over your product search.

To install it, go to SearchWP » Extensions in the left panel of your WordPress dashboard.

go to SearchWP Extensions

Then, find the WooCommerce Integration extension and click Install.

install the WooCommerce Integrations Extension

After you install and activate the extension, you’re ready to start making Divi search WooCommerce products.

Step 3: Customize Your Search Engine Search Sources

To do that, first, click the SearchWP button in the left panel of your dashboard.

go to SearchWP settings

After that, you’ll get to the Engines tab in the SearchWP settings, where you can manage and customize your search engines.

your search engines

A search engine is a set of settings and rules that WordPress follows when performing searches on your site.

With SearchWP, you can fully customize it to meet your business needs, including making Divi search for WooCommerce products.

Plus, you can also hide specific products from search results, enable search by product SKUs, make WordPress search for particular matches, and many more.

To make WooCommerce products searchable on your Divi site, you’ll need to make them an active search source.

To do that, click the Sources & Settings button.

press Sources and Settings

Then, tick a checkbox next to the Products source to make it active and press Done to save your changes.

make Products as an active search source

Now your Divi site will search for WooCommerce products.

Let’s also make WooCommerce product attributes such as tags, categories, and custom fields searchable to increase their discoverability on your site.

To get started, press the Add/Remove Attributes button under the Products search source section.

click Add Remove attributes

Then, click on the Custom Fields field.

click on the Custom Fields field

Next, choose the Any Meta Key option from the drop-down menu.

add the Any Meta Key shortcut

This is a SearchWP shortcut that allows you to automatically make the content of any custom field you have on your site searchable.

The next step is to enable search by product tags and categories.

To do that, click on the Taxonomies field and choose two options: Product Tags and Product Categories.

add product categories and tags

When you’re finished managing searchable product attributes, press Done to save the changes you’ve made to the Products search source.

save your attributes

The final step is to save your customized search engine. You can do that by pressing the Save Engines button at the top right corner.

press Save Engines

Then, click the Rebuild Index button to make WordPress reindex your WooCommerce products and check what attributes they have.

click Rebuild Index

That’s it. Your Divi WooCommerce search has become much smarter, and now your customers can find the right products more easily.

Let’s create a new Divi search page and add your enhanced search bar to it.

Step 4: Add Search Widget to Divi Page

To get started, navigate to Pages » Add New in your WordPress dashboard.

add a new page

Add a title to your page and press the Use The Divi Builder button to open it in the Divi editor.

click Edit with Divi Editor

Next, click Start Building under the Build From Scratch section.

press Start Building

Once you’re in the Divi editor, select the layout of the first row on your page. For example, we’ll choose the first layout.

choose the first row layout

After that, you can choose the module you want to add to your page. Search for the Search module and click on it.

add the search module

Then, press the green checkmark button to save your new module.

click the green checkmark icon

Once you’re happy with how your search page looks, click the three dot icon at the bottom of your Divi editor.

click three dots icon

Then, press the Save button at the lower right corner of the Divi editor to save your page.

press Save

After saving the page, the last step is to test your new Divi search.

Step 5: Test Out Your New Divi Search

To get started, click the Exit Visual Builder button at the top of the Divi Editor to go to your page.

click Exit Visual Builder

Next, search for some WooCommerce products that you have in your store. For example, we’ll search for Fancy Coat.

press Search

As you can see, we found the product using our new Divi search form, as it now searches for WooCommerce products.

we found our product

Let’s also try to find a product by category since our Divi search, enhanced with SearchWP, has become much smarter.

For example, we’ll search for products placed in the Hats category.

search for product by category

You can see there are only products from the Hats category, which means that we’ve successfully made WooCommerce product attributes searchable.

we found products by category

From this guide, you learned how to make Divi search WooCommerce products.

It’ll allow you to create beautiful pages and themes for your WooCommerce store using Divi without losing customers.

Ready to empower search on your Divi site? You can get started with SearchWP here.

Has your Divi search stopped working? Check out our detailed tutorial on how to fix Divi search not working in a few simple steps.

Looking for a way to create a beautiful search page using Divi? Follow our guide on how to create a Divi search results page template.

Want to make your search awesome right now?

More than 30,000 sites have chosen SearchWP!

You can utilize all of the content that’s gone unrecognized by native WordPress keyword search instantly with SearchWP.

Get SearchWP for just $99

  • Committed Support
    If you need help, support is fast, friendly, and here for you
  • Streamlined Setup
    Installation and setup that’s optimized for speed
  • Great Documentation
    Helpful, clear, and usable documentation is a priority

See what SearchWP customers have to say

  • “We’ve been using SearchWP on our Knowledge Base for the past few months, and it has made a significant difference for our clients. It’s helped reduce the number of support tickets because people can find what they’re looking for, and we also love the metrics and seeing trends in searches. If you want people to find things on your site, it’s the best and I highly recommend SearchWP!”

  • “The plugin works exactly as promised. Any questions or issues I had were quickly responded to and had a fairly complex site up and running in hours.”

  • “The ability to setup search engines specific to my custom post types is so badass! Combine that with the awesome related posts extension… beautiful match. Nice work!”

[wpforms id="3080"]