Lazy loaded WooCommerce tables: Now you can search/Sort by SKU
Our WooCommerce Product Table plugin comes with a lazy load option for loading product tables with large numbers of products. In response to popular demand, we’ve just released a new version which lets you search and sort your lazy loaded tables by SKU.
For those of you who don’t know, an SKU stands for ‘Stock Keeping Unit’. The SKU field is built into WooCommerce, providing a way to store a unique identifier code for each product. An SKU is a bit like the ISBN number for a book, but you can use it to store any type of code (text or numeric) for your products, in any format. While the SKU field is optional, WooCommerce.com have published a convincing article about the benefits of using SKU’s in your Woo store.
What is lazy load?
Because of the structured tabular layout, lots of store owners use WooCommerce Product Table to list hundreds or even thousands of products. For example, it’s a popular way to sell technical or wholesale products that require lots of extra data and don’t need big images. You can use it to create a one-page WooCommerce order form, with all the purchasing options such as add to cart buttons or checkboxes, quantity pickers and variation dropdowns directly in the product table view.
Most WooCommerce stores only display 9 or maybe 12 products per page, without variations. The product table layout means that you’re likely to be loading many times more data than this. Inevitably, this can cause performance problems and slow page load times. And that’s where lazy load comes in…
Lazy load is an alternative method of loading the product table, which you can activate by ticking a box on the plugin settings page. Instead of loading all the products with the initial page load, it just loads 1 page of the table at a time.
For example, let’s say you have a table with 1,000 products in total, set to list 25 products per page. Without lazy load, you’d be loading all 1,000 products at once – ouch! That’s a lot of data and most servers won’t cope with this. Instead, you can enable lazy load and just load 25 products at once. Much better!
The problem with lazy load
As you can see, lazy load is a fantastic way of creating product tables such large numbers of products. However, it’s never been perfect.
The problem is that with lazy load, WooCommerce Product Table only knows about the products on the current page. It simply hasn’t loaded the others yet! This means that the searching and sorting is limited. You can search and sort by product name or description because WordPress indexes these fields in a way that the plugin can access without having loaded the entire table. However, until now it wasn’t possible to sort or search by SKU and other data.
Because WooCommerce Product Table is popular for selling technical or wholesale products, people often want to use it to find products based on their SKU. This means that not being able to sort/search by SKU was a big limitation. As a result, this has become one of the most in-demand items on our feature request list.
We’re always looking for ways to improve our WP plugins based on customer feedback. After some head scratching, we found a solution.
New feature: search & sort lazy loaded tables by SKU
Version 2.2 of WooCommerce Product Table is now available. While it looks the same as previous versions, there are lots of improvements and code changes under the hood.
When you create a Woo table with lazy load and an SKU column, a sort arrow will now appear at the top of this column. Users can click on this to sort by SKU in either direction. You can also sort the product table by SKU when the table first loads.
In addition, the AJAX-powered keyword search box above the table will now search by SKU field as well as the product name and description.
Example use case
Here’s a common use case to help you to visualise the new features:
A WooCommerce wholesale store uses WooCommerce Product Table to create a one-page wholesale order form for their WordPress site. They have a large number of products, so they activate the lazy load option to boost performance.
The B2B wholesale buyers already know what products they want to buy, and have a list of SKU’s for their regular products. They simply type a product code into the search box to search by SKU. They then add the product to the cart, and repeat the process to quickly create their order.
This is far more user-friendly than other ways of ordering your regular products. The customer doesn’t have to scroll through multiple pages. Instead, they just type the product code and order much more quickly. Perfect!
Where to get the plugin
If you’re already using WooCommerce Product Table, just upgrade to the new version from the WordPress Dashboard. If you haven’t got it yet, buy it today and start adding searchable, sortable product tables to your store.