Compare Products with WooCommerce 2.0

It’s been a while since an update for the compare products plugin was released, so it was due for some big changes! As always, it is important to note that this is a major update. While hours upon hours of testing happen before the release, minor missed glitches are inevitable. That is why it is always important to backup your website before upgrading to ensure you have a safe point to return to if necessary.

The biggest visual difference is the new compare basket, which makes good use of the latest CSS3 techniques to add a modern, easier to use compare system. Many new options are in store for you as well, so let’s go over some of the key points. (Click here if you want to skip through to the simple list of updates instead)

Cleaner, More Efficient Compare Basket

Perhaps the most important and most desired change is seen with the new floating basket. The prior options are still available, and will still be used unless you change to the floating basket, but this will be the new default option for all new users. Each of the basket locations saw some minor style improvements, but the floating basket is the biggest change. It will stay visible no matter where in the page the customer is looking. It can be collapsed if necessary to show more page content, and it allows the customer to make changes as they scroll through your shop. The basket’s smooth transitioning is handled with CSS, so it should work with most themes with little to no CSS modifications needed.

Speed, Speed, and More Speed

Not as much of a visual change, but certainly noticeable, there were many enhancements made to boost the speed of operations. In the past, the amount of time it took to add a product to the basket was nothing to brag about. This was a big issue that needed to be addressed, and happily it was for this update! The system makes less calls to the server for information, and when it does need to talk to the server, it utilizes the least amount of resources possible. There is no more ‘waiting icon’ after you click the ‘Add to Compare’ button because on a good server you won’t have to wait. Once clicked, the floating basket will pop open to reveal your newly added item.

Various functions were also replaced to be more compliant with WooCommerce 3.0. This helps improve efficiency as well as compatibility with WooCommerce and its other extensions. This plugin remains backwards compatible with WooCommerce 2.6, but you will take advantage of this improvement when running WooCommerce 3.0 or newer.

A Different Perspective

Another goal of 2.0 was to offer more ways to view the table based on prior suggestions from users. The biggest task on the list was making a large table respond well on a small device. The table will now adjust to the space it has, and should it feel it needs more, will enable a sliding ability to scroll through the items added to the basket. This is helpful for viewing on mobile phones, or when a compare table has many items added to it.

A handful of other new features were added to the compare table. There is a toggle for viewing the entire table or only the rows with different values. There is an option to generate the table vertically instead of horizontally if you wish to have the Products in the left column and the features at the top (this works very well with the new responsive table). And by popular demand, the table can now appear in a popup window rather than navigate to a different page within the site.

The Complete List

Many changes were made in version 2.0 of Compare Products with WooCommerce. Not all changes need to be discussed in length, but it is important to look through all of them:

  • Added: New scrolling div compare basket location
  • Added: New WooCommerce product settings: Price, Weight, Width, Height, Length, Dimensions, Stock Status
  • Added: Ability to edit Category and Sub-category titles
  • Added: Differences only filter for comparison table
  • Added: Ability to hide sub-categories from customer view in the comparison table
  • Added: Allowed HTML tags can be used in product fields for custom features
  • Added: Display comparison table vertically with features on top and products to the left
  • Enhanced: Enhanced speed for more efficient operations
  • Enhanced: Uses new WooCommerce 3.0 functions
  • Enhanced: Made tables more responsive for better view on smaller devices
  • Fixed: Add feature popup window would lock after adding a feature to the table
  • Fixed: Disabling the compare feature did not hide comparison buttons and preview box
  • Fixed: Clear All button not working until page reloads
  • Fixed: Deleted attributes caused duplicate rows to appear in compare table
  • Fixed: Unable to delete single items from the compare table

In Conclusion

I am happy to release this update after many months of experimenting with the code to truly enhance its capability. The wait has been long, I know, but I hope the exciting changes will renew your happiness with the plugin. I look forward to your feedback and ask that any and all issues you find be brought forward in a support ticket. Your feedback is always appreciated.