Enhance Your Product Tables with a WooCommerce Cart Popup
I’m happy to report that all of these cart plugins work beautifully with the product table. It’s the perfect way to enable one-page ordering in your store, with instant WooCommerce cart popups.
Looking for a WooCommerce add to cart popup instead? Check out our other plugin, WooCommerce Quick View Pro. This creates product pop ups so that customers can add to the cart from a quick view lightbox.
What is WooCommerce Product Table?
WooCommerce Product Table lists products in a user-friendly order form layout. Customers can view large numbers of products on a single page, choose quantities, select variations, and quickly add to the cart.
How can customers view their cart contents?
Obviously, customers can click through to the cart page whenever they like. However, WooCommerce Product Table is all about bulk buying. You want to encourage customers to add more and more products to the cart, all from the one page WooCommerce order form.
As a result, customers need an instant way to see what’s already in their cart – without leaving the product listings page.
Fortunately, there are several ways to do this:
Option 1 – Add a Cart widget to the sidebar
Some websites using WooCommerce Product Table like to add a sidebar to the page, containing the ‘Cart’ widget that comes with WooCommerce. This instantly updates the cart and displays it in the sidebar when you add products to the cart.
Options 2 & 3 – Add a WooCommerce side cart plugin
Other stores prefer not to have a sidebar on their product table pages. This is because a full-width layout leaves more room for extra columns of information about the products. So how do you display the full cart contents on product listing pages?
The answer is to use one of these free WooCommerce cart plugins for WordPress:
2. WooCommerce Cart
WooCommerce Cart by XootiX is a free WC cart popup plugin. It adds a floating cart icon to the top right or bottom right of your screen. When you add products to the cart, it opens up into a popup window listing the cart contents.
With the free version, you can view the cart contents in the popup, and remove products from the cart. The Pro version also lets you change quantities and has extra features.
3. Woo Floating Minicart
Woo Floating Minicart is another free WordPress popup cart plugin. It’s more subtle than the XootiX plugin because it just displays a subtle floating icon which you can click on to view the cart contents.
The icon shows the number of products in the cart. You can click on it to view the products in the cart, remove products, and click through to the cart and checkout.
Option 4 – Add a WooCommerce added to cart popup plugin
Maybe you don’t want to show the full cart contents at the side of the page. If you’d rather show a popup confirmation that the last product has been added to the cart, then try WooCommerce Added to Cart Popup (Ajax) instead. This free WordPress plugin displays an AJAX-powered lightbox whenever you add products to the cart.
Please note that this added to cart lightbox plugin can only show one product at a time. As a result, I’d only recommend using it with the standard add to cart buttons in WooCommerce Product Table. If you use the checkbox option that lets customers add multiple products to the cart at once, then this isn’t the plugin for you. The lightbox will appear when you click the ‘Add Selected to Cart’ button, but it will only list one product.
This obviously doesn’t make sense if you’ve added multiple products. So if you want to use the add to cart checkboxes that come with WooCommerce Product Table, I’d suggest using one of the side cart popup plugins mentioned in the previous section. These support multiple products, and fit better with the checkbox add to cart option.
How to use a WooCommerce cart popup with your product tables
The great news is that WooCommerce Product Table works beautifully with the three WooCommerce cart popup plugin mentioned above. They work together straight out of the box, without needing any special configuration.
Here’s how to do it:
- First, get WooCommerce Product Table and create one or more product tables using the instructions in the knowledge base. Make sure your product tables include an add to cart column. Choose any other settings you like – the cart plugins work with all the options, including the lazy load method of loading the table.
- Next, go to Plugins → Add New in the WP admin.
- Install and activate the plugin one of the WooCommerce popup cart plugins listed above.
- Go to the cart plugin settings page and choose your options to control how you want your WooCommerce cart popup to work. For example, you can choose the position and behavior of the floating cart.
Finally, go to the page where you’ve added a product table. Try adding products or variations to the cart. You will see the popup WooCommerce cart appear whenever you add products. It looks fantastic and lists the current contents of the cart – perfect!
Where to get the plugins
You’ll need 2 plugins to add product tables with a WooCommerce cart popup to your store: