How To Enable Search Products By SKU, Tags, Categories In WooCommerce

The product search function comes with WooCommerce is often enough for most stores. When you enter a search term in the WooCommerce default search box, if the search engine finds a text match in title or in content, the result will return.

However, what if you want to search products by SKU, tags or catetgories? With WooCommerce default search function, you are out of luck.

The good news is, there is a good plugin that let you add SKU, tags, categories to the product search. It works with most themes too.

So,  how to add the new search power to your site? Let’s find out.

Step 1: Install Advanced Woo Search

The first step is to install a plugin called Advanced Woo Search from WordPress.org repository. You can download it here.

The other method to install this plugin is to search for Advanced Woo Search from your Plugins->Add new panel. At the time of this writing, it’s at the #1 position:

searching for advanced woo search in plugins add new

After installing and activating the plugin, you’ll see its menu appears on the left:

advanced woo search menu item

Step 2: Configure Advanced Woo Search’s options to enable advanced products search on your site

click on that and we’ll get to the main configuration screen:
advanced woo search options first screen

Here are the most important settings you need to pay attention to:

1. Re-index table: You need to click on this, wait for a while for the process to complete

index products for advanced search

2. Clear cache: As you first use the plugin, this button doesn’t hold much importance. However, it’ll be useful later.

3. Seamless integration: I would recommend set this option to On simply because it will enable the search functions for the existing WooCommerce search box. However, some themes may implement their own search functions so this is not guaranteed to work on all themes.

4. Cache results: Caching will make the search faster if the same term is searched over and over.

5. Sync index table: This option will update the index every time your products are updated. This will help bring fresh results. However, if you notice your site’s performance decrease, you should leave this off.

6. Search in: This is the most important feature of this plugin. It enables you to search in SKU, category, tags (fields that are not supported in WooCommerce’s default search function). You can even exclude title, content, excerpt from the search field if you want. However, I don’t see much sense in doing so:

add fields to search when searching for products

7. Show out of stock: This is self-explanatory. Do you want to show out of stock items? If yes, select show.

8. Stop words list: Stop words are words that have little to no meaning and should be exclude from search. You can add or delete words from this list. Make sure to re-index (1.) after changing the text in this box.

9. Do you want to use Google Analytics to track search? If yes, click On. However, you need to setup your Analytics account if you select On for this option.

Now, you are done with 90% of the work. Click on save changes to save your options.

At this point, you can go ahead and try the search function on your site. If you choose seamless integration, you could see the result right away. Let me demonstrate:

Before I have the Advanced Woo search’s seamless integration enabled. I couldn’t search for SKU. For example, I have a product that has SKU is SNK111. Without seamless integration, I couldn’t find the product:

woocommerce default search failed on sku search

Now, with the plugin Advanced Woo Search enabled and seamless integration On, I can search for products with SKU:

search successful with advanced woo search

The plugins does provide other tabs for users to customize the search function further and I encourage you to try those tabs out. The options are very straightforward and easy to understand.

Step 3: Add the Advanced Woo Search widget to your sidebars so your customers can use the advanced search option

If you have used WordPress for a few weeks, I think you don’t have a problem adding widgets to the website’s sidebar. In case you don’t know, let’s go to Appearance->Widgets:

Simply drag the AWS widget to the position on the sidebar you want to show the search box and click on Save. You now have a search  box that is way more powerful than WooCommerce’s default.

 

Conclusion

As you can see, WooCommerce’s default search function stop at searching through text in title and content only. If you want to search a product by tags, by categories or by SKU, you need plugins like Advanced Woo Search. As a free plugin, it allows you to extend the search function, add stop words (words to ignore) and custom design your search box. That’s is great and I think it’s enough for most stores. If you need for more features, consider upgrade to the pro version. (I have no affiliation with the author).

How To Quickly Add Cart Icon On Your WooCommerce Site Navigation Bar

Nowadays, almost all WooCommerce theme has the support for the cart icon on menu. However, what if your theme doesn’t support WooCommerce extensively? What if it lacks the cart icon on the navigation menu? Don’t worry, you don’t have to change your theme. There is a plugin for that.

Here are the steps you need to do to get the cart icon on your navigation menu:

  1. Check if you have a menu created
  2. Check the location of your menu
  3. Install and activate  WooCommerce Menubar cart plugin
  4. Add the cart icon to your navigation bar

Without further ado, let’s get started.

Check if you have a menu created

Creating a menu is one of the tasks that you do first when creating your site. However, speaking from my personal experience, many times I use the default menu that WordPress provides, that is the list of pages on my site. To be honest, sometimes it’s all I need. However, as we are going to display the cart icon on our navigation bar, we need to have at least one menu.

So, let’s go to Apperance->Menus:

no menu available in wordpress

As you can see, I don’t have a menu on this site. So, let’s create one.

I’m going to quickly create a menu here so we can get on display the cart icon on my site’s navigation bar. So, I’ll enter the menu name and click on Create Menu:

create a menu in wordpress

Now I have a menu. You may think that we are done here with the menu. However, there are a few things we need to do. First, it’s to add some items to the menu. I’m going to add the Cart, Shop and Checkout page to the menu:

add woocommerce page to the navigation menu

After clicking on Add to menu, I got my pages appears on the menu. Let’s click on Save menu to save the changes.

The last step is to set this menu to the top navigation position. Let’s click on Manage Locations. The number of navigation menu locations depends on the theme. As I’m using StoreFront, I have three locations as shown below.

available navigation locations on wordpress theme

I want to set the menu to the Primary Menu location only. So I click on Select a Menu and select the menu I’ve just created. I click on Save changes when all is done.

set menu location in wordpress

Now, we are done with the menu. Let’s install the plugin to display the cart icon on the navigation menu of our site.

Install and activate  WooCommerce Menubar cart plugin

Now, it’s the to install the plugin I mentioned in the beginning of this post. It’s a free plugin on WordPress.org. You can download it from here

After install and activate the plugin, let’s go to its settings to familiarize yourself with its options. You can access its settings under WooCommerce-> Menu cart setup

woocommerce menu cart settings

Here are the most important settings:

  1. Select the menu(s) in which your want to display the Menu cart: Let’s select the menu we have created. As you can see, you can display the cart icon on three menus. However, since we are using the free version. There is one location is available.
  2. Hide theme shopping cart icon: If you theme has its own cart icon, you should hide it when using this plugin. The reason is obvious, you don’t want to display two cart icons on your menu bar to confuse your customers.
  3. Always display cart, even if it’s empty: This option is up to you. However, I check this on my site.
  4. Display shopping cart icon: Whether to display the cart icon or not. I personally enable this by default

Other options are grey out since we are using the free version. Let’s click on the save changes button at the bottom of the settings page and visit our site:

cart icon with totals display on the site

Now our site has the cart icon with the cart total.

Conclusion

As you can see, adding cart icon to your navigation bar is easy with the help of this plugin. There are things I like about this plugin:

  1. It’s simple, easy to use
  2. The cart total, items updated when customers add products to cart or remove products from cart

Things I think it can improve:

  1. There isn’t much design choice, even in the pro version
  2. When I hover my cursor over the cart, there is no extra details provided. Normally, when customers hover the cursor over the cart, there will be a drop down showing all the items in cart and an option to go to the checkout page or cart page

Hopefully you find this post and the plugin useful. If you have questions, please leave in the comment section below.