Our latest WordPress plugin - WooCommerce Bulk Variations - is launched today! It's the easy way to list product variations in an instant matrix layout. Your customers will love ordering multiple variations at once!
Our existing WooCommerce Product Table plugin is popular for listing variations in a table layout - either with variation dropdowns, or with each variation on its own row in the table. Lots of our customers have also asked for a way to display variations in a matrix or grid. We have built WooCommerce Bulk Variations to do exactly that!
It takes your variations and lists them in a matrix-style grid format. Each product attribute is listed as one of the axis of the grid. For example, you might list the 'Size' attribute horizontally as columns, and the 'Color' attribute' vertically as rows.
WooCommerce Bulk Variations lets you create 2 types of variations matrix:
Bulk variations order form Add a quantity box for each variation. Customers can enter the quantity of each variation they require, and add everything to the cart at once. This is much faster than the variation dropdowns that come with WooCommerce itself, where you have to select each variation individually.
WooCommerce price grid Disable the quantity boxes and create a read-only variation price grid, displaying the price of each variation without add to cart buttons.
Bulk variations order form
#1: Read-only price matrix
You can enable the variations matrix globally for all eligible products, or you can enable it per-product. The plugin also comes with a shortcode which you can use to insert a variations grid for a specific product anywhere on your site. This is useful if you want to display the grid on a different part of the product page, or on other pages or posts.
The grid is fully customizable. For example, you can choose whether or not to include an image column displaying the variation images.
WooCommerce Bulk Variations will benefit any online store that needs a quicker way to buy variations. For example:
WooCommerce wholesale stores If you sell to the trade and your wholesalers like to buy variations in bulk, then you need a bulk variations form. (Tip: If that's you, then you can use it with our other plugin - WooCommerce Wholesale Pro!)
E-commerce clothes shops If you sell clothes online, then customers can bulk order sizes more quickly by choosing the sizes and colors from a variations matrix.
Food order forms Some foods, such as pizzas, have lots of options (e.g. size and toppings). A food variations order form lists the options in a clear grid. This makes it easy for customers to select quantities and buy.
Products sold by weight If you use variations to sell different weight options of a product, then customers can mix and match from the grid to get the required weight.
Products with two dimensions If the price of a product changes depending on the width and length, then you can set up these options as variations and display them in a grid with the width on one axis, and height on the length.
Technical products with two types of optionA variations grid is perfect for selling technical products that don't require large images. This could be printer ink, spray paint, or electronic gadgets.
Whatever you're selling, if you need a quick way for customers to order multiple sizes or other options at once without having to list each attribute separately, then WooCommerce Bulk Variations is for you.
Can I use it with other Barn2 plugins?
We've integrated WooCommerce Bulk Variations with our other plugins wherever possible. For example, you can:
Display it on pages or quick view lightboxes that are linked to from your product tables.
We've also tested it with various third party plugins such as WooCommerce Subscriptions and Minimum/Maximum Quantities. You can read about these on our list of compatible plugins.
Can I list multiple products in the variations grid?
Each variations grid lists the variations for one product. If you want to create an order form containing more than one variable product, then you need WooCommerce Product Table instead, which provides 2 ways to list variations for multiple products.
Where to get the plugin
WooCommerce Bulk Variations is available now. It comes fully backed by our 30-day money back guarantee. Get it today and see how the matrix can transform your own website!
We’ve got your back. Your purchase is covered by our no-risk 30 day money back guarantee. If for any reason you’re not completely happy with the plugin, you’re entitled to a full refund up to 30 days from your original purchase. No questions asked.
A lot goes into building and running a successful online store. Although hosted e-commerce platforms like BigCommerce take care of much of the heavy-lifting, they don’t always offer the best shopping experience to customers.
The good news is that you can use a BigCommerce product table to make your online store more effective and user-friendly. Essentially, you’d be listing BigCommerce products on a WordPress site in a searchable, sortable table layout with filters. This way, customers will be able to browse your store and make purchases directly from one convenient location.
With this in mind, in this article, we’ll explain what a BigCommerce product table is and how it can benefit your online store. We’ll also show you how to create a product table in WordPress using BigCommerce and Posts Table Pro.
What is a BigCommerce product table and who needs one?
BigCommerce is a hosted e-commerce platform. Out of the box, BigCommerce lets users display products in a standard format. Typically, products are displayed in a grid where each product takes up a considerable amount of screen real estate - like this:
While this certainly adds to your store’s visual appeal, this simply isn’t the best solution for every online store. More specifically, online stores that sell more than a few products or products that aren’t image-centric need a more user-friendly way to showcase their offering.
Grid layouts make it difficult for customers to browse through products, find exactly what they’re looking for, and compare product details. In contrast, displaying your inventory in a product table allows you to showcase more products per page while making it easy for customers to search, sort, and filter through them:
Who needs a BigCommerce product table?
The short answer is that anyone who’s looking for an intuitive and user-friendly way to showcase lots of products in their online store can benefit from a BigCommerce product table. It allows you to display products in a neat table layout with important product details. This makes it easy for customers to be able to view more products (with product details) per page.
For example:
BigCommerce restaurant ordering system
With a BigCommerce product table plugin, you can create restaurant ordering systems that allow customers to place orders online (or at the table). It essentially doubles as a BigCommerce order form.
This resembles a real-world menu in that you simply list out the dishes you offer along with additional details such as ingredients and price. In addition to this, you can also display quantity selectors and add-to-cart buttons directly in the product table layout.
With a BigCommerce order form, you can also allow customers to customize their orders. For example, if you serve pizza at your restaurant, customers would be able to select their crust, sauce, and toppings directly from the product table.
BigCommerce wholesale stores
Generally speaking, people who shop at wholesale stores have a good idea about what they’d like to buy. For this reason, a BigCommerce product table is an ideal implementation for wholesale stores. Here’s why:
Customers are able to find exactly what they’re looking for by using the search, sort, and filter options.
A BigCommerce product list makes it easy for customers to make bulk purchases.
Since wholesale stores sell lots of products, store owners are able to display more products per page then they would be able to with BigCommerce’s default shop layout.
BigCommerce stores selling products that don’t require large images
BigCommerce store owners that sell products that don’t require big images can also benefit from a product table layout. Since the standard format for displaying products in BigCommerce is image-centric, it doesn’t suit products that don’t require big images. Stores like these would benefit more from a BigCommerce product list instead.
These include digital goods such as audio lectures, music sheets, and software. It can also include hardware products like bolts, screws, washers, and fasteners where it’s more important to display product information than it is to display a product image.
How a product table can benefit your BigCommerce-based online store
With BigCommerce, the standard way to display products in your online store is by showcasing them in a grid on your shop page while also giving each product its own individual page.
The problem with this implementation is that it makes it difficult for customers to browse products, compare them, or purchase a lot of different items at once. While this may not be an issue for large products (like furniture) or expensive products (like jewelry), this approach doesn’t offer the best shopping experience for many other types of products.
So, if you’re looking for a way to showcase products in an intuitive, user-friendly way then consider creating a product table. With a BigCommerce product table, you can display more products in an organized way in a neat table layout along with all important product details.
BigCommerce product tables are incredibly beneficial to e-commerce stores, because:
Customers are able to see everything your store offers at a glance.
They allow store owners to curate a selection of products to display on their site (e.g. all organic products).
They make it easy for customers to be able to compare products quickly and make a buying decision.
Product tables take up less screen real estate as compared to other methods of organizing products.
They simplify the purchasing process since customers are able to add multiple products to their cart from a single screen. In other words, they don’t have to visit individual product pages to view product details and add products to their cart.
Introducing Posts Table Pro: The e-commerce product table plugin for BigCommerce stores
Posts Table Pro is a BigCommerce product table plugin that lets you display items in a dynamic table layout with built-in options for searching, sorting, and filtering products.
As a WordPress plugin, Posts Table Pro lets you list BigCommerce products on any WordPress website. The products are still added and maintained via BigCommerce - and orders are still managed via BigCommerce. However, it's a fantastic opportunity to list your products in WordPress - ideal if your main company website uses WordPress, or you want to list products outside of BigCommerce instead.
With Posts Table Pro create customizable product tables easily that improve the customer’s shopping experience and simplify the purchasing process. Specifically, you can tweak:
How each table will appear on the front end.
What information (product details) will be presented and in what order?
Whether you want to display product variations, quantity selectors, and add to cart buttons.
How customers can filter through products e.g. by product category.
Using Posts Table Pro, you can improve the user experience your BigCommerce-based store delivers and potentially improve conversions and increase sales.
How to create a BigCommerce product table in WordPress
If you’ve connected your BigCommerce store to your WP website, you’ll need a way to display BigCommerce products in an intuitive and user-friendly way. With the Posts Table Pro plugin, you can easily list products in a neat table layout.
Assuming you have a BigCommerce store set up with some products and the BigCommerce for WordPress plugin installed on your WordPress website, here’s what you need to do to create a product table:
Step #1: Install and activate Posts Table Pro
To get started, purchase the Posts Table Pro plugin and install it on your WordPress website.
You will receive a zip folder containing all the necessary files upon purchase. Navigate to the WordPress dashboard, select Plugins → Add New, and click on the Upload Plugin button to proceed with the installation.
Go to the Plugins section in your WordPress dashboard and click on "Add New." Then, click on "Upload Plugin" and select the zip folder containing the plugin's contents. Click on "Install Now" to start the installation process, and once it's complete, activate the plugin. Upon activation, the setup wizard for Posts Table Pro will launch and guide you through entering your license key.
Step #2: Customize your table
Start by giving your table a name and select the post type BigCommerce has created for you. And then follow the steps below:
Select the posts or pages you would like to include in the table. The available options will vary based on the post type you selected in the previous step. For instance, if you chose a post with custom taxonomy, the relevant taxonomies will be listed for you to select.
Customize your table to suit your preferences. You can determine which columns to display and in what order. To add a new column, choose the column type from the dropdown menu and click "Add". You can also reorder columns by dragging and dropping the sort icon or column heading.
Filters appear as dropdowns above the table, and you can add as many as you like. It is important to note that available filter options will vary depending on the post type selected on the first page.
Enable lazy loading to improve the table's performance, even when containing hundreds or thousands of items.
Choose how to sort the table. You can set the default sorting option and the sort direction.
Finally, the wizard will confirm that you have finished creating your table and provide instructions for inserting it onto your site.
Step #3: Add the product table to your website
Once you've finished creating your table using the Post Table Pro plugin, the setup wizard will confirm that you're done and give you instructions for displaying the table on your WordPress site.
You have two options for displaying the table:
Use the 'Post Table' block found in the Gutenberg editor.
Copy the shortcode from the table builder and paste it anywhere on your site. This gives you the freedom to place the table on any page, no matter its content.
When you view it, it should look something like this on your site’s front end:
Conclusion
You can use a BigCommerce product table plugin to list products in a neat table layout that’s searchable, sortable, and filterable.
This makes it easy for customers to browse products and see everything your store offers at a glance thereby improving their user experience. As a result, you’ll be able to increase product visibility and, ultimately, boost sales.
We showed you how to create a BigCommerce product table in WordPress using Posts Table Pro. Hopefully, you’re in a good position now to take the next steps.
What are some of the ways you improve your customers’ shopping experience on your BigCommerce website? Let us know in the comments section below.
If you want to create a restaurant website with online ordering for home delivery, there are plenty of services built to help you do that...for a hefty commission! A WordPress restaurant plugin lets you skip the commission and keep your margins for yourself.
People want to be able to get food delivered over the Internet. Online food ordering more than doubled between 2010 and 2015, and those trends are continuing - especially due to the COVID-19 pandemic. Customers prefer ordering online rather than over the phone, and the right WordPress restaurant plugin will satisfy that demand without needing to pay a 15% commission rate.And this won't just be a desktop affair - like all the best WordPress plugins, this one works seamlessly on mobile devices as well.
In this post, you'll learn how you can use the best WordPress restaurant plugins to create your own online restaurant ordering system like the example above, complete with:
Menus
Delivery options and time slots
Pickup options
Notifications (so that you know when a new food order comes in)
You'll be able to customize it to your needs, and you won't need to be a tech savant just to get it working!
The two big benefits of using a WordPress restaurant plugin over the alternatives
There are two huge benefits to using a WordPress restaurant menu plugin over alternatives like GrubHub, JustEat and Uber Eats.
1. You'll save money
First, the big one - saving money!
Just for getting listed at GrubHub, you're giving up a whopping 15% commission rate. And if you want a sponsored listing, you'll give up 20% or more. That's crazy!
The typical margins for food just high enough to justify these commissions. Giving up 15% commission makes a huge difference to your bottom line.
With a WP restaurant plugin, there are no ongoing commissions. Instead, you'll pay a one-time or annual fee for the plugins that you need. After that, everything is profit.
So how much will it cost for a good restaurant plugin for WordPress? The two core tools you'll need - WooCommerce and WooCommerce Restaurant Ordering - will cost you under $150/year.
After that, you might want to further enhance your system with some extra plugins for delivery options or menu customization. However, even with these, you'll probably only spend $200-300 to get the whole system up and running. And again, there are no ongoing commissions after that.
2. You can offer a better user experience
Sites like GrubHub or Deliveroo are, for the most part, one size fits all. That is, your menu and listing pages look exactly like other restaurants.
However, what if your restaurant is unique? What if you make these awesome customizable burgers and you want to create a custom way for people to choose their ingredients and toppings?
With the other tools, you're out of luck. But with a WordPress restaurant plugin, you can tweak things to make them perfect, which helps you create a better ordering experience.
The best WordPress restaurant plugin system
To create your WordPress website's online restaurant ordering system, you'll need two key tools:
An eCommerce plugin This is the backend system that will help you manage food items, accept orders and payments through Stripe, Paypal, etc.
A food order form plugin This is the frontend system that will create a user-friendly restaurant menu for your hungry visitors to browse. It lists your foods in a one-page table layout. You can divide your menu up into different categories, offer customization options, etc.
For the eCommerce part of the equation, the most popular option is WooCommerce. This open-source, free plugin comes from Automattic (the billion dollar company behind WordPress.com) and is the most popular way to build an eCommerce store.
For the food order form, you'll use WooCommerce Restaurant Ordering. It makes it easy to create a customizable frontend food menu that you can adapt to your restaurant's unique needs:
In today’s environment of having to act nimbly for clients, the WooCommerce Restaurant Ordering plugin is the perfect solution for getting a website running quickly. We were able to launch on day one with the help of this plugin. It took all the heavy lifting out of the equation and let us focus on design. If you are debating whether or not this is the solution for getting a restaurant going — look no further, this is the plugin you want. The support is also top-notch!
Use your eCommerce plugin to manage food items and orders
To get started, you'll need to install and configure your chosen eCommerce plugin. For example, WooCommerce.
From there, you can add all of your menu items as "products". For example, if you sell a pepperoni pizza, you'd add that pizza as a product:
If your menu item is customizable, you can use either product variations or product add-ons to give visitors the option to customize their orders:
VariationsVariations are good if people will select a single option from a list. For example, the size of a pizza.
Add-ons Add-ons are good if people can select multiple items. For example, selecting one or more options from a list of toppings. If you want to use product add-ons, you'll need the Barn2 WooCommerce Product Options plugin.
Use the WordPress restaurant plugin to create your front-end menus
Once you've added all of your food items as WooCommerce products, you're ready for the next step. It's time to create your online menu using the WooCommerce Restaurant Ordering plugin.
See, by default, WooCommerce displays your "products" in a traditional eCommerce layout. For example, something like this:
Now, that's fine for an eCommerce store, but it's not a good option for a restaurant menu!
That's where the WooCommerce Restaurant Ordering plugin comes in.
This WordPress restaurant plugin lets you take all your items and display them in a user-friendly food and drink menu layout like this:
Shoppers can add simple food products straight to the cart, or open a lightbox to select variations and add-on options.
As you can see from the above screenshot, the plugin also works perfectly with the WooCommerce 'Cart" widget in the right sidebar, provided your WordPress theme supports templates that allow this functionality. You could also include a widget with a note about your site's delivery area, or even a custom Google Map that shows the area you serve.
The great thing about WooCommerce Restaurant Ordering is that you have 100% control over the information that displays.
Want to add a description column that marks vegan or gluten-free options, or the calorie count? You can do it! 🥗
Want to show, hide or reposition the image of each food? Yup, you can do that, too! 💯
What's more, WooCommerce Restaurant Ordering comes with a shortcode that allows you to incorporate your food ordering system anywhere on your site.
You can even add opening times and prevent people from ordering while you're closed.
[/checkmark_list]
The end result is that you can create a restaurant ordering system that's totally unique to your restaurant's needs and offerings.
Do our FREE restaurant ordering e-course!
FREE COURSE
This online course is 100% free of charge. You'll learn everything you need to know about making your restaurant pandemic-proof by taking food orders online - no experience needed.
Enhance your WordPress restaurant plugin system with other plugins
Get more sales by using WooCommerce Restaurant Ordering with other plugins like Fast Cart
At this point, you'll have a working WordPress restaurant plugin system. However, you still might want to adjust things to tweak how your ordering system works.
WooCommerce Restaurant Ordering is designed to work with many different plugins - not just WooCommerce - and any WordPress theme. That means it integrates as well with your page builder, SEO or multilingual plugins (WPML, WeGlot, etc.), as it does with more obvious pairings - restaurant reservation plugins, food delivery plugins, and so on.
Here are some good options for third-party plugins to enhance your system:
Delivery Slots Allow people to order specific time slots for delivery or collection.
WooCommerce Fast Cart Add a popup cart so that customers can complete their order from the food ordering page.
Dynamic Pricing Lets you create special deals, like buy one get one free.
Twilio SMS Notifications Lets you receive SMS notifications for new orders (by default, WooCommerce only sends email notifications).
WooCommerce BookingsLets you set up a table reservation system alongside your menu to allow your customers to fill out an online reservation form and pre-order their food at the same time.
Build your own WordPress restaurant ordering system today!
Stop giving up your hard-earned margins to middlemen!
With your own WordPress restaurant ordering system, you'll be able to offer the convenience of Internet ordering to your customers, without paying a 15% commission.
Do you have any questions about these WordPress restaurant plugins? Ask away in the comments!
Building a successful online store requires designing it around your specific niche. If you want to run a wine or beer store, for instance, you need to optimize your WooCommerce site to showcase your drinks perfectly. This means finding the right tool to sell wine online with WordPress and WooCommerce.
Fortunately, the WooCommerce Product Table plugin offers the perfect solution. It adds the layouts you need to sell wine and other alcoholic drinks from a user-friendly one-page order form.
In this post, we’ll talk about why WooCommerce Product Table is a smart way to create your wine store. Then we’ll walk you through the process of setting up your shop and start selling wine online in minutes. This simple method works equally well for selling wine, beer or any other type of food or drink. Let’s jump in!
Why WooCommerce Product Table is the perfect way to sell wine online
If you want to improve the way you display products in your WooCommerce store, you can’t go wrong with WooCommerce Product Table. This handy plugin helps you add a table listing out your wines, and summarizing their key features in an easy-to-scan format. Customers can sort and filter the table to find what they need quickly, and even place orders without leaving the page:
WooCommerce Product Table is an ideal way to sell wine, beer or spirits online. Building a successful online wine store requires designing it around your niche. the unique requirements of your niche. For example, you’ll be selling a lot of drinks that are quite similar, distinguished only by attributes such as brand, year, or region. This means you need to find a way to organize all your wines clearly, and make it easy for customers to choose their favorites and order.
Fortunately, WooCommerce Product Table simplifies this process dramatically, since you can:
Include search, sort, and filter functionality, which means customers can use the product table to quickly find the wine they want.
Display product attributes right in the table, so people can see important information about your wines at a glance.
Add images, helping each variety or brand of wine stand out. Wines sell best with small thumbnail images, and WooCommerce Product Table offers the perfect layout for this.
At this point, you’re probably wondering how much work it is to start selling wines online with WooCommerce and WooCommerce Product Table. Fortunately, it's easy to set up and you won't need to hire a developer. Let’s walk through the process of setting it up and using it to sell wine online.
At this point, your wines will appear in the default WooCommerce layout which is not suitable for selling wine online. The next step is to transform your store into a customer-friendly wine shop! Keep reading and I'll tell you exactly how to do this.
1. Add age confirmation features to your store
In a moment, you’ll start creating your product table. First, however, you’ll want to add a few age confirmation features to your site. Since you’ll be dealing with alcohol, you need to make sure you aren’t unintentionally selling to minors.
There are a few ways to ensure that your clientele is of legal age to purchase alcohol products from your WooCommerce store. Read through each option, and choose the one that best fits your needs:
Hide your entire WooCoommerce wine store behind age verification First, you can require age verification before people are even allowed to enter the e-commerce areas of your site. The WooCommerce Private Store plugin is perfect for the task , letting you require that visitors enter their age before accessing the store pages. (Your other pages such as the homepage, blog and other standard pages remain available for everyone to view, which is important for your SEO/search engine optimization.)
Keep your store public, and add an age verification popup If you'd rather not hide your store from public view, then you can add a WordPress age validation popup plugin such as Age Gate. This will ask customers to confirm their age before they enter the store.
For even more security, you can also add an age confirmation feature to your checkout page. Using a custom field, you can ask customers to enter their age when making a purchase. To do this, you’ll need WooCommerce’s Checkout Field Editor extension:
Now that your WooCommerce wine shop is properly protected, let’s talk about how to display your wine products.
2. Install the WooCommerce Product Table plugin
The first thing you’ll need to do is purchase the WooCommerce Product Table plugin, and then install and activate it.
When you buy the plugin, you’ll receive a license key. To enter that key, navigate to WooCommerce → Settings in your WordPress dashboard. Go to the Products tab, and then choose the Product tables subsection. Paste in your key, and click on Save Changes at the bottom of the page:
Don’t leave this page just yet. It’s time to start setting up your product table and choose how it will list your wines and beers.
3. Set up a basic product table
First, you’ll want to decide what information about your wines to include in the product table. You can do this in the Columns section of the settings page:
Simply list out all the columns you want to appear in your table, separated by commas as in the above example. Here's a full list of columns that can be included in the plugin’s documentation.
To sell wine online with WooCommerce, we’d suggest including (at the least) the product name, as well as a featured image, description, price, and add-to-cart option. You may also want to include a categories column to help organize your wines.
We’ll come back to these settings in a moment. First, let’s see what the product table looks like so far. Save your changes, and then navigate to Pages and create a new page. The next step depends on whether you're using the Classic Editor or Gutenberg:
Classic Editor - Click the 'Insert Product Table' toolbar button. This adds a [product_table] shortcode to the page.
Gutenberg - Add the [product_table] shortcode to a 'Shortcode' block.
This will add a [product_table] shortcode to your page, which will list your wines using the settings you just customized. If you preview it now, it will look something like this:
Or if your page doesn't have a sidebar, then the table of wines will fill the width of the page.
This is a great start, and now you’ll probably want to personalize the table further. So save this page as a draft, and return to the Product tables settings in the WooCommerce tab.
4. Add key features to your wine shop product table
There are a ton of options and features you can add to your product table, and we encourage you to read up on all the choices available. Right now, let’s focus on the settings most crucial to your up-and-coming WooCommerce wine store.
First, you may want to display extra information in your table about product attributes, so users can quickly tell the difference between the various wines and make easy selections. Attributes themselves are added through WooCommerce, and can be found and created in the Products → Attributes tab of your WordPress dashboard:
To add an attribute as a separate column in your table, you can include it in the list under Default options > Columns. Just make sure to preface the attribute name with the att: tag (for example, att:color or att:year):
Now, your product table will be a little more comprehensive:
In addition, your visitors will often want to quickly search through your product table for wines that meet specific criteria. You can make this easy by adding filters. The WooCommerce wines product comes with 2 types of filters which customers can use to refine the list of wines:
Filter dropdown menus that will appear above the table and enable customers to refine the list by product category, tag, attribute, and so on.
Filter widget which appear in the sidebar of the page where you're listing wines in a product table. These are added via the 'Widgets' page in the 'Appearance' section of the WordPress Dashboard.
To add filter dropdowns, go to the Filter dropdowns section, and select Show based on columns in table:
If you view your list of wine products now, you’ll see the new dropdown filters immediately:
You can also select the Custom option to determine exactly which columns can be filtered and which can’t.
At this point, you have an informative and fully-functioning WooCommerce wine store up and running. Customers can use it to view all the wines and beers you offer, search for specific varieties, and make easy purchases. Of course, you can continue to tweak your product table as much as you like! For example:
Encourage customers to buy more by choosing the 'checkbox' add to cart button style. They can quickly tick multiple wines and add them all to their cart together.
Add a sidebar to your page and add the WooCommerce Cart widget. Customers can see the contents of their cart and edit it alongside the list of wines.
Speed up your product tables by enabling the lazy load and caching options.
There’s one more feature you may want to add to your wine store – subscriptions. Many customers will enjoy getting the same wine bottles or boxes delivered at regular intervals. This is a smart way to get recurring revenue from your store, keep customers loyal, and increase your average customer lifetime value.
With this tool, you can create whatever subscriptions you like, and enable customers to set up recurring payments. Then, it will simply inform you whenever a new order needs to be shipped. It's a fantastic way to increase the revenue from your WooCommerce wine store.
Bonus feature #2 - Speed up your wine shop with WooCommerce quick view
When you're selling wine in WooCommerce, it's best to keep customers on the list of wines. People tend to buy multiple wines at once, so you don't want to take them to a separate page for each wine. After all, they might not find their way back to the wine list!
If you want to show more information about each wine than will neatly fit in a product table, then quick view is the answer. The WooCommerce Quick View Pro plugin is designed to work on its own or with WooCommerce Product Table. It adds quick view links or buttons to the table.
There are lots of reasons why quick view can improve your WooCommerce wine shop:
Show extra information without taking customers to a separate page.
Choose what information to show in the quick view lightbox. For example, this might be multiple product images (e.g. a glass of wine, the bottle, and a wine crate), the short description, reviews, and add to cart buttons.
Select variations andquantities directly from the lightbox.
Bonus feature #3 - Use bulk discounts to sell more wine online
By default, WooCommerce has a set price for each product. Given the high delivery costs associated with selling wine online, customers like to stock up on wine and buy a few months' worth in a single order. Volume discounts are a great way to encourage them to buy more wine from you.
You can easily set this up using the WooCommerce Discount Manager plugin. This lets you automatically calculate volume discounts based on the quantity in the customer's cart. It can also display a table of quantity-based discounts on the product page, encouraging people to buy more.
Conclusion
If you want to sell wine online, you’ll need to design your e-commerce wine store thoughtfully. What's more, you’ll want to find a way to show off your wines in the best light, and make ordering as simple as possible. The WooCommerce Product Table plugin enables you to do both of these things, and much more.
To set up a store where you can sell wine online, follow these five steps:
Add age confirmation features.
Install the WooCommerce Product Table plugin.
Set up a basic product table.
Add key features to your wine shop product table.
Enable customers to purchase subscriptions.
Do you have any questions about how to sell wine online using WooCommerce Product Table? Let us know in the comments section below!
WooCommerce is an incredibly powerful and flexible e-commerce platform. You can use it to create just about any type of online store and offer all kinds of online shopping experiences. You can even use it to create a WooCommerce mix and match products website.
Whether you’d like to start selling custom gift hampers, assorted donuts, and pastries, or bespoke food boxes, WooCommerce makes it incredibly easy to get started.
Paired with the right plugins, WooCommerce is the perfect solution for selling bespoke mix and match products and taking customized orders. After ensuring compatibility and setting everything up, your customers will have the ability to place personalized orders on your online store. They can view items in a user-friendly, catalog-like list, choose options and tick the items they’d like to add to their order and place their customized order. All from a one-page WooCommerce order form.
In this article, we’ll cover everything you need to know about WooCommerce mix and match products. You'll learn how to add products in WooCommerce, as well as how enabling customers to personalize their orders can benefit your online shop and how people are utilizing this feature. We’ll also step through a quick tutorial to help you create your own WooCommerce mix and match online store using the WooCommerce Product Table plugin.
Let’s get started!
Some examples of WooCommerce mix and match products
Mix and match products work by allowing customers to select individual products they’d like to purchase and add them to a gift hamper, product box, or bundle items. Let’s take a look at some of the most popular types of WooCommerce mix and match products that you can sell with WooCommerce.
Example #1: Pizza, sandwich, and salads
Customizable food items such as pizzas, sandwiches, and salads are often sold using a mix and match system. For instance, a WooCommerce-based restaurant that allows customers to place orders online usually allows customers to choose toppings and filings to put together their own meals. This is just one of many mix and match products examples, where WooCommerce can be utilized to offer personalized and customizable options to customers, such as selecting ingredients for their pizza, sandwich, or salad.
Your WooCommerce mix and match products offering may vary slightly depending on what you're selling. However, the core concept remains the same. Essentially, you allow your customers to build their own meals. For instance, if you were selling pizzas then you’d let customers choose their base, sauce, toppings, and dips. They mix and match the pizza options to create their own customized pizza - all using WordPress and WooCommerce.
Example #2: Gift hampers and product boxes
Buying a hamper as a gift is always more special when you can select the individual items you’d like to add to it. Whether you’re selling face and body products, wines and candles, decadent chocolate, corporate gifts, or gourmet products, you can create a personal gift experience by letting customers mix and match their own selection of items.
Learning how to add products in WooCommerce opens up several avenues for offering WooCommerce mix and match products on your online store. Some companies, for instance, sell custom meat or vegetable boxes to customers on a subscription basis. With WooCommerce, you can easily offer this option on your online store, in addition to selling custom meat or vegetable boxes on a subscription basis and other mix and match products examples. Keep reading to learn how to do this and more.
How do customers mix and match products in WooCommerce?
Create WooCommerce mix and match products order forms to let customers build their own customized product boxes. It will look something like this:
This is how the WooCommerce mix and match products system works:
You have a page on your online store where you list all of the products (and variations or other options) that customers can choose from Generally, the products are divided into several categories, each listed separately on the mix and match page. The categories should be based on how the customer would actually put together their mix and match product box.
The customer chooses items to create their own unique mix and match products box Standalone items appear on individual rows of a table, whereas mutually exclusive items appear as dropdown lists within a single row of the table. The customer simply ticks a checkbox next to each item they’d like to add to their mix and match product box.
Once they’ve picked out all of the items they’d like to purchase, they click the Add Selected to Cart button This adds all the selected items to the WooCommerce shopping cart.
The customer views their cart and can make changes to it, if necessary Once they’re happy with the order, they can proceed to the Woo checkout page and make a payment.
As the store owner, you’ll receive an email with the order details You can then build the customer's mix and match product box, add the products they selected to it, and ship it to them.
Which WordPress plugins will I need?
Under the hood, the mix and match products system uses WordPress to power your overall ecommerce website. It requires a free WooCommerce plugin to create products and manage the checkout process. You'll also need the WooCommerce Product Table plugin to list your inventory in a table layout on the mix and match product order form.
Next, I'll tell you how to set up your WooCommerce mix and match plugin. But first, let's look at a real-life case study of a website with this exact setup.
Case studies - How other WooCommerce websites sell mix and match products
Inspire Cosmetics - mix and match cosmetics boxes
Inspire Cosmetics - selling mix and match cosmetics boxes
Inspire Cosmetics has created a multi-step process for ordering mix and match make-up and cosmetics boxes.
They used the Beaver Builder WordPress page builder plugin to create a series of four connected pages in tabbed layout options. Each tab contains a separate list of WooCommerce mix and match products, created using the WooCommerce Product Table plugin.
This makes it quick and easy for customers to choose a box, select the contents and place their order in WooCommerce.
Barks & Squeaks - selling mix and match pet hampers
Barks & Squeaks use WooCommerce and WooCommerce Product Table to sell mix and match gift hampers for pets.
They list the items from each category on a single page. The customer chooses their box options first, then scrolls down to mix and match the contents.
Now you've learned all about how a WooCommerce mix and match plugin works. Next, I'll tell you how to set it up on your own WordPress website! Keep reading and we'll get started straight away.
How to create a WooCommerce mix and match products website
Letting customers put together their own product bundles using a product configurator can help you increase sales and make the customer feel special.
This tutorial assumes you already have WooCommerce installed on your WP website. If not, check out the fantastic guide on how to create a WooCommerce online store. When you're ready, continue this tutorial to transform it into a WooCommerce mix and match product configurator.
Here's a video on how to set it all up. You can also read our detailed written instructions below.
Step 1: Create the mix and match product categories
First, figure out how you’d like to design the mix and match products' user flow. Decide which categories you’d like to divide the WooCommerce mix and match ordering system into.
For example, if you wanted to let customers build their own gift hampers, you might consider creating a category for the box (or hamper), the contents, and wrapping and filling:
It’s a good idea to create a logical category structure that takes the customer on a journey and helps them put together their WooCommerce mix and match product in an intuitive and user-friendly way. In the above example, customers would order using a three-step process:
Select a box or hamper.
Choose the items they’d like to add to the box or hamper.
Configure padding and wrapping options.
This way, your customers can mix and match their own bespoke gift hampers and personalized product boxes.
Once you’ve settled on which categories you’d like to create, head over to Products -> Categories and create as many as you need.
Step 2: Plan out products and add them to your online store
Next, we’ll add the individual items we want to sell to our WC online store. The items that customers can mix and match to build their product box should be added as WooCommerce products.
Following our example, here are some of the WooCommerce products you might add under each mix and match category:
Box/Hamper
Hamper
Box
Contents
Candied Nuts
Luxury Biscuits
Decadent Chocolates
Red Wine Bottle
White Wine Bottle
Packaging
Gift Wrap
Ribbon
Straw Filling
First, jot down all of the products you’d like to sell. Categorize them under one of the categories you created in the previous step. Once that’s done, you need to decide whether you’d like to create each item on your list as an individual product or group it into variations.
To decide whether a particular product needs to have variations, consider whether the customer would have to make an either/or choice. In the example outlined above, the customer would have to pick either the hamper or the box. Whereas in the second stage, they’d simply be asked to select all of the items they’d like to add to their product box (or gift hamper).
Add products and/or variations based on these principles:
For 'or' choices where the customer can only choose one option, create a WooCommerce variable product. Add each option as a variation.
For 'and' choices where the customer can choose multiple options, create a standalone WooCommerce product for each item.
Tip: If you want to add multi-select options to individual products, keep reading to learn how.
Step 3. Add products to WooCommerce
Once you’ve planned out your products, add them to your WooCommerce store by following these steps:
Navigate to Products -> Add New from the admin panel.
Enter the WooCommerce mix and match the product’s details such as product title, description, and featured images.
Assign categories and tags.
From the Product Data section, choose a product type based on the format you’ve decided:
Simple Product. For standalone products that customers can add to their mix and match product bundles without variations, select the Simple Product.
Variable Product. Select Variable Product for all mutually exclusive items that customers can personalize before adding to their shopping carts. Follow these instructions to add variable products.
Click the Publish button.
Follow these steps to add all of your products to your online store.
Step 4: Create a mix and match products page
Now we're getting to the fun part! This is where your WooCommerce mix and match products configurator comes to life.
By now we’ve added all of the products to our WooCommerce store and categorized them. Next, we'll list everything in a mix and match products order form. By doing so, customers will be able to mix and match products and build custom gift boxes.
How to set it up
Purchase the WooCommerce Product Table plugin and install it on your WordPress website. You’ll receive a confirmation email with installation instructions and a plugin license key.
Head over to WooCommerce -> Settings -> Products -> Product Tables. Configure the following settings in the Add to cart column section:
Set the Add to cart button option to Checkbox only.
Set the Variations option to Show as a dropdown list.
Choose the Below table next to the ‘Add Selected’ position
Go to Pages -> Add New to create a new page where we’ll list the WooCommerce mix and match products. Add any text that will appear above the order form, such as instructions or information about the ordering process.
Divide the page into sub-headings. Each sub-heading will be based on the categories you created in Step 1. Following our example, the sub-headings might be Step 1 - Choose a Box, Step 2 - Choose your Contents, and Step 3 - Choose the Finishing Touches.
Finally, add the following shortcode under each sub-heading: [product_table category="toppings"]. Replace toppings with the slug of the corresponding category. You can get the category slug from the Products > Categories.
Tip: Use the other settings and the Product Table knowledge base to further customize your WooCommerce mix and match products order forms. For example, you can choose which columns to include in the product list.
That’s it! Now hit the Publish button and preview your page on the storefront. It should look something like this:
Bonus tip #1 - Add extra mix and match product options
Product add-ons appear in the add to cart column of the mix and match product configurator.
So far, you've learned how to use variations to add a choice of options for each mix and match products. This is fine for most WooCommerce mix and match configurators. However, variations aren't suitable if customers need to be able to select more than one option at a time.
Fortunately, you can easily do this with the WooCommerce Product Options plugin. This fantastic WooCommerce extension makes it easy to add extra options to your mix and match products. For example, you can add multi-select checkboxes to each product. You can even add text boxes where the customer can enter a personalized message.
Bonus tip #2 - Too many options? Add quick view lightboxes
Some WooCommerce mix and match products websites end up with a large number of variations or options for each product. For example, look at the Pizza Fiorentina product in the screenshot above. This product has 2 rows of product add-ons, which isn't a huge number of options - and it's already taking up a fair amount of vertical space. As a result, you can easily imagine what would happen if you tried to list several dozen options per product!
The solution is to remove the add to cart column from your mix and match products table, and replace it with quick view buttons. You can do this by adding the WooCommerce Quick View Pro WordPress plugin.
Customers click on the quick view buttons to view more product information and purchase options in a lightbox window.
There are lots of benefits from using quick view to sell WooCommerce mix and match products:
You can choose what information to include in the lightbox. For example, you may wish to show the full gallery of product images. Or you may wish to hide the images and just show extra product data or add to cart options. Alternatively, you can have both! Either way, there's no limit to the number of variations and options that you can offer in the lightbox.
Customers remain on the product table at all times and don't have to visit a separate page to purchase each better. That's why quick view is better than using the single product page to sell mix and match products.
WooCommerce Quick View Pro also supports other methods of selling mix and match products such as grouped products, Composite products, and Product Bundles. List the products in a table, and customers can create custom product bundles from within the quick view lightbox.
Bonus tip #3 - Sell mix and match product subscriptions
Most mix and match WooCommerce products configurators sell products on a one-off basis, with a single payment.
If you prefer, you can create mix and match product box subscriptions. The instructions are the same as above, but you need to add the YITH WooCommerce Subscriptions plugin to take repeat payments.
WooCommerce Subscriptions make it easy to accept free trials and regular payments for each product. You can choose whether to offer a free trial and whether customers will be billed weekly, monthly, or whatever frequency you like.
Bonus tip #4 - Restrict how many mix and match items the customer will order
So far, you've learned how to sell mix and match products by setting a fixed regular price for each product or variation. The total order cost is the sum of all the products that the customer selects and adds to their cart.
Some WooCommerce mix and match websites prefer to set a fixed cost for the entire product box. If you do this, then you'll need to add a product price for the box itself and set the price of the contents products as $0.00. (You can easily hide the item pricing column of the tables listing the box contents.)
If you do this, then you'll want to restrict the number of products that the customer can order. You can easily do this with the WooCommerce Quantity Manager plugin. Its plugin lets you create a minimum and maximum quantity rules. The rules prevent customers from ordering the wrong amount - essential for selling fixed price mix and match products in WooCommerce.
For example, you might set a minimum and maximum quantity of 1 for the box itself. You would then add a maximum quantity or value for the 'box contents' category. This controls how many items can be added to the box.
Bonus tip #5 - Sell mix and match packages with quantity-based discounts
Perhaps you want to sell WooCommerce mix and match products with a choice of packages, with discounts based on the number of products ordered. This is a good way to give discounts based on the number of photos purchased, without having to restrict the number of products that each person can buy.
To do this, use the WooCommerce Discount Manager plugin to dynamically change the price based on the number of products in the cart.
Next, you need to display the information in the frontend in a format that will encourage people to buy more:
At the top of the page, add information about the different packages and prices.
Underneath, use WooCommerce Product Table to list your mix and match products.
Customers can choose as many photos as they like and they will automatically be charged the correct price for their package.
Where to get the plugins
Letting customers mix and match products to create personalized product boxes and gift hampers is a great way to deliver an exceptional customer experience. And the best part is that it’s incredibly easy to do with the WooCommerce, WooCommerce Product Table, and Quick View WordPress plugins.
Now you know how to create your own WooCommerce mix and match product order form. Hopefully, you’re in a good position to take things further.
How do you use mix and match products in your WooCommerce store? We’d love to hear from you so let us know by commenting below!
If you want to improve the shopping experience on your WooCommerce website and increase sales, then you need to make it easier to purchase products. Customers are likely to buy more if you let them add multiple products to the cart from one page.
Here’s how it works: the customer simply ticks a checkbox to select each product they’d like to buy. Next, they click an Add Selected to Cart button to add everything at once. Finally, they head over to the checkout page.
In this article, we’ll show you how you can use the WooCommerce Product Table plugin to allow your customers to select multiple products and add them to the cart from a single page. Before we begin, let’s quickly take a look at how your Woo store can benefit from this.
Why you should let customers add multiple products to the cart from one page
If you’ve been using WordPress and WooCommerce for some time, you probably already know that the default layouts and user flows are very limited. There's no built-in way for customers to add multiple products to the shopping cart at once.
At best, your Woo product listing pages include an Add to Cart button for individual products. If a customer wants to buy more than one product, they’ll have to click a separate Add to Cart button to add each product to their cart.
What’s worse is that they have to visit the single product page of each product they want to purchase. This might be to get more information, set quantities, or configure product variations.
We needed a plugin to be able to add multiple products to a cart at once. After looking around we weren't able to find much other plugins other than yours.
With the WooCommerce Product Table plugin, you can improve your customer’s shopping experience by creating smooth one-page ordering. Instead of navigating to single product pages, your customers can shop directly from the product table view.
WooCommerce Product Table lets you add multi-select checkboxes alongside (or in place of) the Add to Cart buttons in the product table view. Customers will be able to tick the checkboxes next to the products they’d like to buy and select multiple products. They can choose their quantities and product variations directly from the table layout. Finally, they can click a single Add Selected to Cart button. This will add multiple products to the cart at once.
I was looking for a way for people to buy multiple things on one page, one-stop shopping.
By allowing customers to quickly select products, you can speed up shopping user flows on your online store. As a result, you’ll effectively be improving your online sales and conversion rates.
Which businesses can benefit from letting customers add multiple products to the cart from a single page?
How do you know if your WooCommerce online store will benefit from offering customers quick buying options? The first thing you need to do is analyze your customers’ buying habits. Ask yourself if it makes sense to buy multiple products from your online store at a time.
A click - click - click method of adding items to the users cart is what we needed.
Although multi-select checkboxes certainly have their benefits, not every business can benefit from them. For instance, if you’re selling large furniture, customers are likely to buy one (or maybe two) items at a time. However, there are plenty of products that lend themselves to multiple ordering, and this is where WooCommerce Product Table comes in.
Examples of products that customers typically buy more than one at a time
If you’re selling small, low-cost products or products that are meant to be used together then your online store can certainly benefit from having a multi-select checkbox system.
Does your WooCommerce store fall into any of these categories?
Low and medium cost products. When making purchases isn’t backed by major buying decisions, customers are more inclined to add multiple products to their shopping cart. In fact, improving your shopping user flow might even encourage them to buy more from you. E-commerce stores selling stationery items, toys, books, cosmetic products, and jewelry (for example) can benefit from letting their customers use WooCommerce to add multiple products to the cart from one page.
Related products. If you’re selling products that are designed to be used together, then you can improve the shopping experience by letting customers add multiple products to the cart from a single page. For instance, if you’re selling clothes then your customers are likely to purchase more than one item from you. If they’re buying a t-shirt, they might also purchase jeans or sandals to go with it to complete their look.
Build-your-own products. Online stores selling any kind of build-your-own product can benefit from letting customers add multiple products to the cart from the product listings page. This includes stores selling items such as gift hampers, custom cosmetic boxes, or bakery items.
And that’s not all!
As you can see, there are many other businesses and online stores that can improve their shopping user flows simply by letting customers add multiple products to the cart from one page.
Customers view your foods in a list and tick all the meals they require. No need to visit the single product page! A WooCommerce add multiple products to cart plugin could be just what you need.
Introducing the WooCommerce Product Table plugin
WooCommerce Product Table is a plugin designed for WooCommerce websites that lets users add multiple products to the cart from one page.
It lets you list products in a customizable, searchable table layout with a checkbox next to each product. You can choose to display an Add Selected to Cart button directly above and/or below the product table.
With the WooCommerce Product Table plugin:
You can create a single product table to list all of your products with multiple Add to Cart buttons and/or checkboxes.
The product tables are fully customizable, searchable, and sortable. You can add them pretty much anywhere on your site (pages, posts, or widgetized areas) simply by inserting a shortcode. Its the perfect bulk add to cart plugin for WooCommerce.
How to add multiple products to the cart from one page in WooCommerce
If you have a WooCommerce online store, you can use the WooCommerce Product Table plugin to create a functional product listings table. Customers will be able to use the product list table to add multiple products to the cart from one page. Here’s what you need to do:
Get the WooCommerce Product Table plugin. You’ll also receive a license key for using the plugin in a confirmation email.
Log in to your WordPress website and head over to Plugins → Add New. Upload the plugin’s zipped file and click Activate.
Navigate to WooCommerce →Settings →Products → Product Table and paste your license key into the License Key input field.
From the same screen, scroll down till you see the Add to cart button option and select Checkbox only. This will display a multiple add to cart checkbox next to each product item in the table layout. Alternatively, select the Button & checkbox option if you want to display individual Add to Cart buttons alongside the multi-select tick boxes.
Read through the other settings and make any other changes to customize how you want the product tables to behave.
Head over to Pages → Add New to create a new page (or edit an existing page) that you’d like to add the product table to.
Add the [product_table] shortcode to your page.
Click the Publish button to proceed.
That’s it! A product table will automatically be generated on the front-end of your WooCommerce website. It'll include options to let users add multiple products to the cart from one page. It might look something like this:
Display important product information in the table
One of the key benefits of using the WooCommerce Product Table plugin is that your customers don’t have to visit single product pages to get important product information or add to the cart.
The purpose of letting customers add multiple products to the cart from one page is to speed up the shopping user flow. For this reason, it doesn’t make sense if customers can't get important information directly from product listing pages. You want to display everything the customer needs to make a purchasing decision in the table layout.
"We were looking for a product table with the ability to buy several things without being directed to the individual product pages and well, that's what your plugin does! :)"
With WooCommerce Product Table, you can choose which columns to show (or hide) in the table view. Out of the box, the plugin supports all the standard product data that WooCommerce stores in the WordPress database. You can also add extra columns, such as custom fields and taxonomies. Here’s a complete list of the available columns you can choose from.
Choose your columns carefully to maximize your sales. Add the columns that will actively encourage customers to add more products to their shopping cart. For example, you might decide to include a product reviews column. This will give customers some insight into what other people thought about the product.
Let customers select quantity and product variations
Customers might want to use a quantity selector or provide variation options to customize their product or order. Making these options available alongside the Add Selected to Cart button will further improve your site’s user experience.
Here’s what you need to do:
Activate the quantity selector. The WooCommerce Product Table plugin comes with a built-in option to display a quantity selector directly in the table layout. Simply activate the quantity selector option from the plugin’s settings page. By doing so, customers will be able to set a quantity before adding a product to their cart.
Display product variations. With the WooCommerce Product Table plugin, you can display product variations as dropdown lists or as separate rows.
If you’re using the WooCommerce Product Options plugin in tandem with WooCommerce Product Table, extra product options will show up next to the Add to Cart buttons. In some cases, adding variable products might not make sense for the type of product you’re selling. Instead, you can add extra options (in the form of checkboxes, radio buttons, or text fields) directly to the table layout.
Add product quick view buttons
Adding multiple products to the cart is all about keeping the customer on one page. So what happens if you want to provide extra information which doesn't fit on the one page order form? You don't want to send customers to a separate page for each product - that defeats the purpose of the multi-add to cart features.
The solution is to use the method described in this tutorial with the WooCommerce Quick View Pro plugin. This plugin works with WooCommerce Product Table and adds quick view links or buttons to the WC order form. Customers click on these links to view more product information in a quick view lightbox window. They can learn more about the product and then close the lightbox to return to the one page order form, where they can add multiple products to the cart. This aids multiple purchases better than sending customers to multiple pages.
If you want customers to add multiple products to the cart at once, then you may wish to remove the add to cart buttons from the quick view lightbox. Instead, use the plugin settings page to show other information in the lightbox such as the short description and full product image gallery. Customers will still need to use the multi-select checkboxes to add products to the cart, directly in the order form. Or if you prefer, you can have the checkboxes on the order form AND allow customers to purchase products individually from the lightbox. The choice is yours.
Adding multiple products to the cart is all about letting customers order more quickly and easily. However, that's only the first half of the customer journey.
It's equally important to provide quick ways for customers to add their details and complete the purchase. That's where WooCommerce Fast Cart comes in.
This handy plugin displays a popup cart and checkout after customers add products to the cart. They can then complete the order directly in the popup, without leaving the page. This is much better for customers than having to visit separate cart and checkout pages.
Add WooCommerce Fast Cart for a quick popup cart and checkout.
Letting customers add multiple products to the cart form one page:
Improves the shopping user flow for your customers.
Boosts sales.
Increases the value of each sale.
Depending on what types of products you’re selling, speeding up the buying process and letting customers select products quickly just might convince customers to buy more from you.
"It is super simple for the customer to select many items at one time."
Do your customers typically purchase more than one product from your online store at a time? If so, do you think that letting them add multiple products to the cart from one page would improve their shopping experience? Share your thoughts in the comments section below!
If you’re looking for a simple solution for taking food orders at the counter or table using an iPad/tablet, look no further! This tutorial will teach you how to create a WooCommerce POS food ordering system for your restaurant’s waiting or behind-the-counter staff – with no technical expertise.
If you run any kind of restaurant or café, having software that facilitates taking food orders is a must-have. The idea is simple: instead of writing down the customer’s order on paper, the waiting staff simply input it into the food ordering system. This facilitates taking food orders at the counter or table using an iPad/tablet.
A WooCommerce POS food ordering system simplifies the order taking process. It makes it easy for the waiting staff and behind-the-counter staff to add and remove items from the order and select variations. The food order is then instantly sent to the kitchen.
I’ll show you how to use WooCommerce and the WooCommerce Product Table plugin to create a one-page restaurant ordering system that allows staff to take food orders from customers. They can use the system on an iPad or tablet, which is much more convenient and customer-focused than traditional methods.
First, I’ll show you how to install and setup the WooCommerce Product Table plugin on your WordPress website.
Next, you’ll learn how to use this plugin to create a user-friendly, one-page ordering form. Your restaurant's waiting staff can use this form to browse, select, and customize the customer’s order.
And, finally, we’ll share some tips on how you can improve the order taking process through advanced features like sending orders directly to the kitchen from your WooCommerce store.
Let’s begin.
Why your restaurant’s waiting staff needs a WooCommerce POS tool to take food orders
Traditionally, a restaurant’s waiting or bar staff takes customer orders on a notepad and inputs it into a static computer screen. This creates a record and forwards the information to the kitchen. Unfortunately, this method for taking orders causes a number of problems:
Most restaurants run outdated software on their computers that's difficult to use, instead of something modern and user-friendly (like WordPress and WooCommerce).
Waiting staff usually take the customer's order on paper (or memorizes it) then inputs it into the computer. This often leads to inaccurate food orders being placed. I'm sure everyone has experienced being served the wrong dish, or an important request being overlooked!
Since there's usually only one computer, waiting staff often have to queue to input the customer's food order. This causes delays in sending food orders to the kitchen. In addition, it prevents wait staff from using their time efficiently. The same applies to over-the-counter food orders, for example at a deli or takeaway restaurant.
Desktop computers take up valuable space at the counter or behind the bar.
The solution is to set up a WooCommerce POS food ordering system to take food orders directly at the table, bar or counter using an iPad/tablet.
It makes life easier for both your staff and you as a store owner.
How your restaurant can benefit from an automated POS food ordering system
A WordPress website with a WooCommerce POS ordering system will simplify store management and allow your waiting staff to take customer orders quickly. It's easy to set up, and uses the market-leading WooCommerce plugin with a few tweaks and extra plugins.
An automated food ordering system not only makes it easy for the waiting staff to take customer orders but it also creates operational efficiencies in your restaurant. Essentially, it works like a portable point of sale (POS) system. Instead of jotting down the customer’s order, the waiting staff simply has to select the right food boxes. This improves food order accuracy and makes it easy for them to read the customer’s order back to them.
And after the customer’s order has been placed, it’s automatically sent to the kitchen staff. This way, the waiting staff can move on to the next table or the next customer in line, instead of having to go to the kitchen first.
Finally, whenever you're ready to take things to the next level, you can extend this functionality to build an online food ordering system for your restaurant or offer customers a takeaway option.
What you'll need to get started
WooCommerce is the world's leading e-commerce platform. Ideal for selling absolutely anything, you can use it to organize food items on your menu as products, display a shopping cart, place orders, and checkout. It's a free plugin that you can install on any WordPress website. For those of you who don't already have a WP website, there are tons of online resources you can use to get started with WordPress.
In addition to a WordPress site with WooCommerce installed on it, you'll also need the WooCommerce Product Table plugin. This is what transforms a normal Woo store into a POD food order system.
Introducing the WooCommerce Product Table plugin
Although the free WooCommerce plugin comes with a built-in layout, it's not really suitable for POS food ordering. The WooCommerce Product Table plugin displays your food items in a simple, one-page table layout that doubles as a quick food order form.
Unlike traditional WordPress food delivery plugins, it allows waiting staff to take customer orders. They can search, sort, and filter the food items in your restaurant’s order form to quickly find each food and place orders. They can:
Choose food item variations or add-on options directly from the food order form.
Use the quantity selector to order a particular food order for many people.
Add extra notes about the order, such as special dietary requirements (requires an additional WordPress plugin.)
Make a note of the customer's table or queue number, which is sent to the kitchen for fulfillment.
How it works
Completed orders are automatically sent via email and can appear on a computer screen. Alternatively, you can install a WooCommerce order printing plugin to automatically print orders in the kitchen.
If the customer is dining at the restaurant, they can pay at the end of their meal in the usual way. At the counter, new customers can pay for their orders using your existing payment methods. This is done separately from the food ordering system, which is used to take orders and send them to the kitchen. (If you'd rather take credit card payments directly in the WooCommerce point of sale system, that's fine too.)
The best part is that if you already have a WordPress website for your restaurant or food business, you can simply create a hidden area on it for your online store POS system instead of investing in a separate system.
How to create a food ordering system for your restaurant’s waiting staff
Once you’ve got a WordPress website with a WooCommerce-ready theme installed, you can step through this tutorial to begin creating a food ordering system. The food ordering system is designed to help the waiting staff take customer food orders from behind the counter (or bar) or at the table. Either follow it from start to finish or jump straight to a specific step:
Once you've installed the WooCommerce plugin on your WordPress website, add your restaurant's menu items as WooCommerce products:
Navigate to Products > Add New from the WP dashboard and enter the following product details:
Product name. This is the name of the menu item that will appear in your WooCommerce POS food ordering system.
Product description. Enter the full description of the menu item in the main text editor.
Product data. Enter the menu item’s price, type, SKU, attributes, and variations here.
Product short description. You can create a short description for the menu item if you’d like.
Product categories. Organizing menu items into categories helps keep everything organized. You can create categories like Main Course, Starters, or Beverages.
Product tags. Similar to categories, tags help you further organize your food items and make it easier for waiters and waitresses to find particular food items. For instance, you could use tags like Vegetarian, Healthy, or Non-Vegetarian.
Product image. This is the food item’s image that you can choose to display in your food ordering form.
In the 'Product Data' section, use the 'Simple Product' type for foods where there are no options or choices. Use 'Variable Products' for adding choices. For example, if you are creating a 'Rump Steak' product then you could add a variation for 'Rare', 'Medium Rare', 'Well Done', etc.
If you have a limited number of an item, you can also set up product inventory management so that your staff knows when an item is finished for the day.
Once you’re done, click the Publish button. Repeat this process until you’ve added a new product for all of your menu items.
Bonus tip: Add text boxes and other extra fields to your food items
You can use the Product Options add-on to add a text box for each product that allows the waiting staff to add notes next to each food item. Let's say a customer requests extra cheese on their pizza or informs the staff that they have a nut allergy. The waiting staff can add their request (or information) as a note against the food item.
Product Options is also a good alternative to product variations in case you want more flexibility. For example, you can add extra checkboxes and various other options.
Step 2: Install and activate the WooCommerce Product Table plugin
Next, you can start displaying your foods in a one-page WooCommerce POS food order form:
Navigate to Plugins > Add New from the WordPress dashboard and upload the plugin’s zipped file to your website. Once that’s done, hit the Activate.
Head over to WooCommerce > Settings > Products > Product Table and paste your license key into the License Key input field.
Step 3: Configure the WooCommerce Product Table settings
Now that you have the WooCommerce Product Table plugin installed and activated on your website, you can configure various options on its Settings page. This will make the WooCommerce POS food order form look the way you want it to on the front-end.
3a. Decide which columns you’d like to display in the table
Since you’re creating a quick order form for your restaurant’s waiting staff, choose columns that will make the food ordering process most efficient for them. As a bare minimum, include columns for the food item’s name, price, and add to cart button. For this, you can simply add name, price, add-to-cart to the Columns option.
You can also choose to include an image of the food item if that would make it quicker for the waiting staff to identify an item on the menu. Simply enter image, name, price, add-to-cart to the Columns option.
You might also consider including the menu item's SKUand stock in your POS food ordering form. Customers often request foods by referencing a code on the printed menu. For example: "We'd like two number 9's and a number 14 for dessert". This way, your restaurant's waiting staff can add the menu item's SKU to the search box or sort by SKU to quickly find the dish the customer would like to order.
I also recommend including a stock column in your food processing form. This is a great way for the kitchen staff to keep the waiting staff up to date with the availability of each dish. Just make sure kitchen staff have access to the WooCommerce back end in the WordPress admin, so they can update stock availability in real-time.
Here’s a complete list of available columns that you can pick from and display in your WooCommerce POS food order form.
3b. Configure additional settings
There are a number of different options that you can configure from the WooCommerce Product Table’s settings screen. However, our goal is to make it as quick as possible for the waiting staff to select products and place a customer’s order. For this reason, I’d recommend making the following configurations:
Under the Table content section
Enter none in the Product links section. There's no need for waiting staff to visit the single product page, and disabling the links prevents accidental clicks/taps.
Within the Add to cart column section
Make sure the Quantities checkbox is ticked so that staff can increase the quantity for each item.
Set the Variations option to Show as dropdown list. If you're using variable products, this will add a dropdown listing the options to the add to cart column.
Under the Table controls section
Set the Search box option to position the product search box Above table. Your restaurant's waiting staff can use the search box to quickly find the dish the customer ordered. For example, they can enter the food item's name or SKU.
Use filters for efficient service
I recommend adding filters for the information you've added about your menu items such as product tags, categories, or attributes. Filters make it easy for the waiting staff to quickly find specific types of dishes. To do this, set the Product filters option to Custom and then add tags, and attributes to the Custom filters option.
In addition to the custom filters that can be set up within WooCommerce, using the WooCommerce Product Filters plugin can provide even more advanced filtering options for your food order form. Here's an example of a WooCommerce food order form with a range of attractive filter options:
Add filters with [WooCommerce Product Filters](https://barn2.com/wordpress-plugins/woocommerce-product-filters/?utm_source=barn2&utm_medium=salespage&utm_campaign=salespage&utm_content=salespage-wro-wpf)
With this plugin, you can add filters based on categories, tags, attributes, prices, and more. This makes it even easier for your staff to find specific dishes and for customers to quickly locate the items they want to order.
Here’s a complete list of the other various filter options you can set for your food order form.
These configuration settings are optimized to deliver a good user experience for taking WooCommerce POS food orders at the counter or table using an iPad/tablet.
Step 4: Create a one-page WooCommerce POS food order form for waiting staff
By now you’ve set up the WooCommerce Product Table plugin on your WooCommerce restaurant site and configured its settings. Next, we’ll create a simple, one-page food order form for waiting staff to take food orders at the counter or table using an iPad/tablet. We’ll do this by adding the WooCommerce Product Table plugin’s shortcode to our food ordering system page.
Create a new page for your WooCommerce POS food order form by navigating to Pages > Add New from the WordPress admin. Waiting staff will use this one-page food ordering form to select foods, add them to the shopping cart, and place an order.
Give the new page a title. I’ve called mine Food Ordering System.
Add introductory text in the text editor if you’d like to display information on the order form.
Create sub-headings (Starters, Main Course, or Beverages) for each section of your menu.
Under each sub-heading, add the shortcode [product_table category="category-slug"] to display food items from the relevant category. If you wanted to display items categorized under Starters, you’d use the shortcode [product_table category="starters"].
Publish the page and click the Preview button to view it. It should look something like this:
Step 5: Simplify the checkout process for waiting staff
Since we’re using WooCommerce, the waiting staff will have to complete the required checkout fields and click the Place Order button to place the customer’s food order. That's because WooCommerce is normally used for taking customer orders. Our needs are slightly different because waiting, bar or behind-the-counter staff are using it to take orders on behalf of the customer. Therefore, we want to make the checkout process as fast as possible.
You can do this by configuring the checkout page to accept payment after placing the order. This way, the waiting staff doesn’t have to make a payment when they place the order. Here’s what you need to do:
Head over to WooCommerce > Settings > Payments from the WordPress admin panel.
Select an offline payment gateway such as Check payments or Cash on delivery. This way, the waiting staff will be able to place the customer’s order without actually having to pay.
Click the Manage button to rename the payment method or add a description. For example, if you have selected 'Check payments' then you can rename this to something like 'Payment required at end of meal'.
Click the Save changes button to proceed.
Now, your checkout page should look something like this:
By default, WooCommerce requires the waiting staff to fill out the Billing details form. You can use the Checkout Manager plugin to remove the Billing details fields and make the checkout process even faster for the waiting staff. Alternatively, create a shared user account for your staff to use, and enter the default billing details for your restaurant. That way, this information will be auto-populated for each order and they can ignore this page and just click the 'Place order' button to send the order to the kitchen.
Bonus tip: Use one-page checkout to put the POS order form and checkout on the same page
Want to speed up your WooCommerce POS plugin even further? You can do this by adding the WooCommerce checkout to the same page as your WooCommerce Product Table order form. This removes the need to waste time clicking through to the cart and checkout pages.
There are two ways to do this:
Add the shortcode [woocommerce_checkout] underneath your POS order form. This will add the default WooCommerce checkout immediately underneath the order form.
Alternatively, you can use the official WooCommerce One Page Checkout plugin with WooCommerce Product Table. This has extra features, such as the ability to edit the contents of the cart from directly within the one-page checkout.
If you want customers to be able to make a credit card payment directly into the WooCommerce POS system, that's fine too. There are a few ways to do this:
Add an additional payment method such as Stripe, and customers can enter their credit card details directly into the checkout page. (If you want to be able to scan their card, then you'll need to use a separate card reader and process payment outside of the WooCommerce order system.) Obviously, this only applies when you are taking orders from customers in person and not for phone orders!
If the customer will be reading out their credit card details over the phone, then you still need to add a credit card payment method such as Stripe. Add the products to the cart and proceed to the checkout as usual, and then enter their payment details on the checkout while they're still on the phone. Submit the order and only end the call when you see the order confirmation page - this means that the credit card payment has been processed successfully.
For in-person payments, you can order a card reader which integrates with the website. There are 2 good options for this:
Bonus tip: Add extra fields to store the customer’s table number, token number, or name
Taking POS food orders at the counter or table using an iPad/tablet becomes even easier if you can add additional information directly to the order form. If the waiting staff need to note down any additional information, they’ll need an extra field or two. This could be:
Customer's name.
Customer’s table number.
Token number.
The Checkout Manager plugin allows you to add, edit, and remove the fields shown on the WooCommerce checkout page. Use this to add an extra field to the checkout form which allows the waiting staff to input the customer’s table number, token number, or name.
Bonus tip: Allow barcode scanning
If you also let customers place takeaway orders via your restaurant ordering system, you can set it up so that customers can pay online and your staff or support team can verify their order by scanning a barcode with a tablet or smartphone. There are lots of free barcode scanner apps for iOS and Android that let you do this.
To add a barcode to each order, you'll want the official WooCommerce Order Barcodes plugin, which offers an easy WooCommerce POS integration.
Each customer will get a unique barcode for their order that they can show to your staff on their own smartphone (or they can print it out).
Step 6: Automatically mark orders as complete
WooCommerce normally requires payment before it will mark orders as complete. This isn't relevant to you, because you will be taking payment outside of the website at your physical store - e.g. at the end of the meal.
Use the Custom Order Status WooCommerce plugin to automatically mark all orders as complete. This ensures they are correctly sent to the kitchen without any further manual steps.
Step 7: Send orders to the kitchen
By default, there are 2 ways for the chefs in the kitchen to see new orders:
WooCommerce will send new orders to the email address added in the settings.
If the kitchen has access to the WordPress admin, they can keep the WooCommerce orders page open and refresh it regularly to see new orders.
If you'd rather have new food orders printed automatically to the kitchen printer, then you can do that too. You can pair your WooCommerce-based food ordering system with a GPRS printer. This way, you’ll be able to automatically print new food orders straight to the kitchen printer as soon as the waiting staff has placed the customer’s order.
You can do this using the excellent Bizprint plugin.
Step 8: Hide the food order system from public view
You might be adding your WooCommerce POS food order system to an existing WordPress site. For example, maybe you use WP for your public restaurant website.
If this applies to you, then you'll want to use the food ordering system from public view. It should only be available to staff who take orders at the table, bar or counter.
A quick solution is to password protect the page containing the POS food ordering system. This way, only staff with the correct password will be able to access the food ordering system.
However, your food 'products' will still appear on other parts of your site such as in search results. To fully hide all parts of the WooCommerce POS order system from public view, you'll also need the WooCommerce Private Store plugin. This adds the extra security you need.
In the WooCommerce Private Store plugin settings, choose the same password as you used to protect the food order form page. That way, staff just need to enter one password and it will unlock the ordering page and all other parts of WooCommerce.
A feature-rich WooCommerce POS food ordering system for your restaurant or food business
It's easy to create an efficient (and accurate) POS food ordering process for your waiting staff, counter and bar staff.
With the WooCommerce and WooCommerce Product Table plugins, you can create a searchable, sortable food order form for your restaurant. This makes it easy for waiting staff to take food orders at the counter or table using an iPad/tablet.
You can take things to the next level whenever you’re ready. Simply upgrade your restaurant’s food ordering system by pairing it with some of the other plugins we mentioned.
What are some of the features you’d like to see in a WooCommerce POS food ordering system that facilitates taking food orders at the counter or table using an iPad/tablet? Let us know by commenting below!
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.
If you're creating an order form for your e-commerce store, then you're likely to want a WooCommerce one-page checkout too. Keep reading to learn how to enable WooCommerce one-page shopping.
WooCommerce one-page checkout lets customers select products and complete their purchase within a single page. One-page shopping is excellent for user experience because it's fast, so the customer is less likely to get frustrated and you're less likely to have a high cart abandonment rate.
The perfect WooCommerce one page checkout plugin needs two things:
An easy way to view and find products, select options, and add them to their order without leaving the page. This involves listing WooCommerce products in a quick one-page order form.
A WooCommerce checkout form - either underneath the product order form or in a popup on the same page.
Unfortunately, setting up WooCommerce one-page shopping isn't as easy as it sounds. Most order form plugins meet the first requirement but come short with the second one. And the official WooCommerce.com extension for one-page checkout isn't great at displaying products.
This tutorial will tell you how to meet both requirements - no coding required! You'll learn how to list products in a quick order form, with a choice of two types of WooCommerce single page checkout.
But first, let’s cover the basics – what is a one-page checkout?
What is WooCommerce one-page checkout?
A WooCommerce one-page checkout can either appear on the page under the products, or as a popup on the same page
As I mentioned above, a WooCommerce single page checkout allows customers to select products and complete their purchases – all on one page.
Why do I need a WooCommerce one-page checkout plugin?
Typically in WooCommerce, a customer needs to add products to their shopping cart, then go to the cart page and then to the checkout page. This means that there are multiple steps to the point of making a purchase.
In the simplest of terms, this is bad. Research shows that 22% of abandoned carts happen because the checkout flow is too long. The more pages the customer has to click through to make a purchase, the less likely they are to complete it.
A WooCommerce single page checkout combines all the steps onto one page, allowing for a faster checkout experience.
You can speed up the purchase process by using a WooCommerce single-page checkout plugin to list products and allow customers to complete their journey on the same page. This is why even WooCommerce has created its own one-page checkout plugin. But there’s a catch 😲
The 3 best WooCommerce one page checkout plugins
Next, let's explore the 3 best plugins for adding one-page checkout to WooCommerce. We'll start with the official extension from WooCommerce.com. That's a good starting point but has limitations. As a result, Plugin #2 will provide an alternative way to implement one-page checkout, and Plugin #3 works alongside the official extension to add the missing functionality.
Read about all three plugins to choose the combination that will work best for your customers.
It does this well, except that it lists products in a very basic way. That's fine for displaying one product or a small number of products with a checkout form underneath. However, this plugin is useless for product selection if you have a large number of products. It also fails to deliver if you want to enable customers to search, sort, and filter the list of products to find what they're looking for.
Any eCommerce store with numerous products needs to seriously consider user experience and make things easier for the customer. This involves listing products in a user-friendly way:
The products have to be easy to find.
All the important product data needs to be visible at once, without having to visit multiple pages.
Customers need to be able to choose quantities and compare variations from one page.
Luckily, there are two easy ways to improve on this. We'll do this with Plugins 2 and 3 in this list.
Plugin 2: Display a popup checkout on your main shop pages
Rating: 5 out of 5 stars
I think that the most user-friendly way to enable one-page checkout in WooCommerce is to display the checkout in a popup window on the same page as your products. That way, you don't add clutter to your shop pages - and yet customers can quickly check out on the same page where they add products to their cart.
With this type of WooCommerce single-page checkout, the checkout form appears in a popup instead of below the list of products. In this case, the customer journey looks like this:
The customer visits the product table page and uses the search, sort and filtering to find the products they want.
They select the products and add them to their cart.
A popup immediately appears over the product table. The customer makes any changes to the selected products, enters their details and completes the purchase without having to leave the page.
You can easily add this type of WooCommerce one-page checkout with the WooCommerce Fast Cart plugin. This lets you display a popup cart and/or complete checkout on the same page as your products. When a customer adds a product to the cart, you can either display the popup on-page checkout automatically, or let them click on a floating cart icon to launch it.
Use the WooCommerce Fast Cart plugin to add a popup checkout to your shop pages
Go to the WooCommerce Fast Cart settings page at WooCommerce → Settings → Fast Cart.
Choose how you want the fast cart to work. In particular, I recommend enabling the 'Direct Checkout' and 'Auto Open' options. Together, these make the checkout appear as soon as customers add products to the cart. It's the fastest way of using the plugin for a WooCommerce one-page shopping experience.
Plugin 2: List products in a searchable order form with one-page checkout underneath
When we discussed Plugin #1, I told you about the limitations of using the WooCommerce One-Page Checkout extension on its own. The main problem was that it lists products in such a basic way, with no way to search or filter them. That's where WooCommerce Product Table comes in.
This bestselling WooCommerce one-page checkout plugin lists products in a searchable order form, allowing for a quick browsing experience. You can list hundreds or even thousands of products, with quick search and sort filters so that customers can easily find what they want. After adding products to their order, customers can add their details and checkout, directly on the order form page!
An example of one page shopping in WooCommerce
You'll need two plugins to implement this method:
WooCommerce Product Table to list products in a searchable one-page order form. This will allow you to list all your products in a single easy-to-navigate table which you can place on any page. You can choose which columns of information to include, add product variation dropdowns, and even add a search box and filters. The lazy load option lets you list hundreds or even thousands of products, neatly separated by pagination links.
Together, this will create a seamless checkout experience for your customers. They won't have to switch between pages to find each product they are interested in. It's true one-page shopping, regardless of how many products you have.
Setup instructions for WooCommerce one-page checkout
Use the plugin setup wizard to choose the essential information about your product tables, such as which columns of information to display about your products. Here are some tips for creating an effective WooCommerce one-page shopping experience:
If you want to list lots of products, you'll probably want to choose the 'Checkbox' add to cart option. This adds a multi-select option so that customers can add lots of products to the cart at once.
If you're selling variable products, then choose either the 'dropdown' or 'separate' variation options. This lets customers choose variations directly in the order form instead of having to click through to the single product page. (After all, that would defeat the purpose of a WooCommerce one-page checkout!).
Enable the 'Quantity' option so that customers can buy more than one of each product.
To prevent people from leaving the one-page order form and clicking through to the single product page, enter 'none' in the 'Links' option. This disables links to the single product page.
Keep the number of rows per page fairly low so that customers don't have to scroll too far to view the checkout under the table. If you have more products than the number of rows, then pagination links will appear under the table so that they can view more products without leaving the page
Finally, go to the plugin settings page at WooCommerce → Settings → Products → Product tables. Disable the 'Ajax Cart' option in the 'Add to cart behavior' option. By leaving this box unticked, the page will reload when customers add products to the cart, displaying the one-page checkout underneath with the correct products.
Step 2: Create a landing page listing your products
WooCommerce Product Table lists your products above the one-page checkout, like this
This is where we create the page that we'll be using as our WooCommerce single-page checkout:
Create a new page (Pages → Add New).
Add a shortcode to the page: [product_table]. This will list all your products with the options you chose on the plugin settings page. There are lots of options to edit the shortcode, for example, if you want to list specific products only. You can add as many product tables as you like to the page - just add the shortcode more than once.
Step 3: Add one-page checkout to WooCommerce
Next, you need to add one-page checkout to the page you just created.
Edit the product table page that you created in Step 2, above.
Add the following shortcode underneath the product table shortcode: [woocommerce_one_page_checkout]
Your finished WooCommerce order form page should look something like this in the WordPress back end:
This will create a WooCommerce single-page checkout with a product table at the top, and the checkout form below.
FAQ
What is the best WooCommerce one page checkout?
The best WooCommerce one page checkout allows customers to complete their purchase as quickly as possible. You can achieve this with the WooCommerce Fast Cart plugin by allowing checkout in an on-page popup. Equally, you can achieve it by combining WooCommerce Product Table with the official One Page Checkout extension.
Both are good options from a functionality standpoint. However, you may want to consider your customer's behavior and preferences when choosing which WooCommerce single-page checkout to use. If your customers usually buy a single or just a couple of items per session, you may want to go with the pop-up checkout option. It's fast and seamless and allows for a very quick checkout:
On the other hand, if your customers tend to purchase several different items at a time or would prefer a more traditional checkout experience, you may want a checkout form below your products. This way, customers can take their time to add products to their cart one by one (or remove products if they change their mind). Finally, they can scroll down to the checkout form once they're ready to place the order.
How can I create a custom checkout page in WooCommerce?
In this article, we've looked at how to display the default WooCommerce checkout under a list of products; and how to display it in a popup checkout. None of these plugins will actually change the design of the checkout.
We have a separate article on how to create a custom checkout page. Once you've done this, the customized checkout will automatically appear in your one-page checkout - whichever of the above plugins you are using. That's because they inherit the styling of the default checkout, so if you edit this then it will be reflected in your one-page checkout.
Is a one step checkout better than a multistep checkout?
The beauty of WooCommerce one page checkout is the speed of making a purchase. WooCommerce multistep checkout does the opposite by adding extra steps to the process. However, the two concepts are more compatible than you might think. This is because you can add a multistep checkout to a single page - for example, as tabs within that one page.
This handy plugin is perfect if you want to streamline your checkout process or even add custom checkout fields. For example, you can use it to collect extra information from each customer. This will appear on the WooCommerce one-page checkout, whether you've added it below the list of products or in a popup checkout.
You can also use the editor to write more persuasive calls to action and change the purchase button - instead of the standard 'buy now' CTA, you can easily do some A/B testing to find out what works best for your customers.
Can I disable the WooCommerce cart completely?
If you're using Plugin 2 (i.e. Fast Cart with a popup checkout), then you can easily disable the cart. Simply enable the 'Direct Checkout' and 'Skip Cart Page' options on the plugin settings page. That way, customers can only access the checkout and there are no back doors to the cart page.
However, this is a bit trickier if you're using Plugins 1 and/or 3. Even though the checkout appears below the list of products, there are still ways for customers to access the cart page. For example:
The cart link will still appear in your navigation menu and/or header (depending on your theme and menus).
When the customer adds products to the cart, they will see a success message linking to the cart.
If your WooCommerce order form page includes a sidebar with the 'WooCommerce Cart' widget, then the contents of the cart will show after they add products. This widget includes links to the cart and a separate checkout page.
An Add to Cart success message with a link to the Cart page.
It's absolutely fine to use these checkout features alongside one-page checkout. It gives customers a choice. For example, if they want to edit the contents of their cart, they can click through to the cart page and check out afterwards. This is handy because WooCommerce one-page checkout lists the products in the cart without any means to edit them.
However, some online store owners prefer to completely disable the WooCommerce cart and just use the one-page checkout. That's fine too.
How to do it
The simplest solution is to add a 301 redirect to stop people from accessing the cart page. You can do this by installing the free Redirection plugin and redirecting the cart page to wherever you like.
For example, you might redirect the cart page to the WooCommerce checkout. This is the checkout page defined in the WooCommerce settings, and is separate from the one where you've added a product table.
Alternatively, you could add an anchor link to a point underneath the product table on your one-page checkout page, and create a redirect so that people are taken there when they click on a cart link. When a customer adds a product to the cart and sees the success message with 'View Cart' link, clicking it will scroll them down the page to the WooCommerce one-page checkout under the product table.
Get the best WooCommerce one-page checkout plugin now 🚀
In conclusion, a WooCommerce one-page checkout can greatly enhance the shopping experience for your customers. It can increase your conversion rate, and ultimately boost your online sales.
By streamlining the checkout process and reducing the number of steps, you can eliminate unnecessary barriers. This makes it easier for customers to complete their purchases.
With the right implementation and customization, a one-page checkout can be a powerful tool for any WooCommerce store looking to improve their checkout process and drive growth. So, take the time to consider which type of one-page checkout is best for your business.
To add one-page checkout to WooCommerce, you can either:
Both options offer a great way to reduce cart abandonment by optimizing how customers complete their purchases. Choose the right plugins for your needs, and make your customers happy 😄
