4 steps for creating a WooCommerce one page order form
When it comes to e-commerce, providing a streamlined customer experience is critical. If it’s easy for shoppers to browse your products and add items to their carts, they’ll be more like to follow through with their purchases. However, WooCommerce creates a separate page for every product on your site by default, which can quickly clutter up your online store.
A one page order form can put your entire product catalogue at your customers’ fingertips. By creating a one page store, you can streamline the shopping experience and encourage customers to purchase more products. It can also make your site hugely attractive to wholesale customers and bulk buyers.
In this article, we’ll explore how WooCommerce one page order forms work, and why you might want to add one to your online store. We’ll then show you how to build your own one page shop in four easy steps. Let’s get started!
Understanding the Typical WooCommerce Store Layout
The layout of your WooCommerce store is usually determined by your site’s theme. However, many popular e-commerce themes such as Storefront include some standard elements. This means that most WooCommere e-commerce stores function similarly.
Typically, customers may start by searching for a product they’re interested in. This might involve entering the name of a specific product in the search bar, or navigating through your product categories and subcategories.
When a customer finds a product they’re interested in, they can learn more about it by visiting that item’s dedicated product page. Here, the customer can also add the item to their virtual shopping cart.
Some stores feature variable products. For example, you might sell a hoodie that comes in several colors or sizes that customers can choose between. These options will be visible on the product page as well.
Most WooCommerce stores feature a separate Cart page where shoppers can view which products they’ve selected. This gives them a chance to remove unwanted items or edit their variation selections before proceeding to checkout.
The checkout process typically occurs on yet another separate page:
For many e-commerce stores, this is the desired setup. It enables shoppers to browse available products and learn more about the ones they’re interested in purchasing.
However, this isn’t the best layout for all e-commerce stores. In some scenarios, it may make more sense to create a one page order form.
An Introduction to WooCommerce One Page Order Forms
A one page order form condenses the product selection and checkout process into a single page. By opting for a one page order plugin such as WooCommerce Product Table Ultimate, you can display your entire catalogue in a compact visual display:
Customers can purchase any product from your catalogue by clicking on its accompanying Add To Cart button. If a customer wants to purchase multiple versions of the same item, they just need to enter the desired value into the Quantity field.
Sometimes, customers may want to purchase several items. This is particularly common among wholesale buyers. In this scenario, the customer can select each item’s accompanying checkbox and then click on Add selected to cart.
Here’s a step by step guide on setting up a wholesale store with WooCommerce
This will add all these items to their shopping cart in a single action, saving the shopper time:
Customers can even purchase variable products directly from your one page order form. For these items, WooCommerce Product Table Ultimate displays a Select Options button:
Your customers can click on it and all of the options available for that product will become visible. When they’re happy with their selections, they can add the variable product to their shopping cart as they would with any other product in the table.
Why (And When) You’d Want to Create a WooCommerce One Page Order Form
A one page order form displays everything your online store has to offer in a single location. This convenience can help drive sales by making your products easier to find and purchase, particularly if you have a large product catalogue.
If your store features lots of similar items, a one page order form can make it easier for customers to compare and contrast these products. This can help shoppers make more informed purchasing decisions and improve their experience.
The ability to compare products also makes one page order forms a good fit for takeaways and restaurants. Customers typically expect to compare all starters, main dishes, desserts, and sides from the same page. If you spread your menu across multiple pages, it could make for a poor customer experience.
Follow this guide for how to accept online orders for your restaurant
One page order forms can also appeal to wholesale and B2B customers. When placing a large order, it can be difficult to navigate between multiple product pages. Your wholesale customers will likely appreciate the ability to build their orders by working through a compact, organized list.
All that said, a one page order form isn’t suitable for every online store. This includes e-commerce sites where your products require a significant amount of supporting information.
For example, electronics stores might have dedicated technical specifications for each product. This information is crucial to helping shoppers make informed purchasing decisions, so it typically makes sense to include it on a dedicated product page rather than trying to squeeze it into a product table.
A one page order form may also be unsuitable for stores with a limited product catalogue. A streamlined shopping experience can benefit your customers. However, shoppers may be underwhelmed by an e-commerce store that’s stripped down to just a few lines in a table.
How to Create a One Page Order Form For Your Website (In 4 Easy Steps)
WooCommerce is a popular e-commerce plugin. However, it doesn’t provide features specifically tailored towards helping you build a one page order form out of the box.
While you could build a custom one page order form using WooCommerce’s built-in tools and the WordPress Block Editor, this would require a significant amount of time and effort. Thankfully, there are available plugins that can extend this popular e-commerce platform and make it easy for you to create your streamlined layout.
You can build a one page order form in four easy steps using a dedicated plugin such as WooCommerce Product Table Ultimate. After installing and activating it, you’re ready to get started with Step 1 below.
Step 1: Build Your One Page Order Form
The first step is specifying the content you want to include in your one page order form. For example, you might create a minimalist form that contains only the information wholesale customers need to reorder products they’re already familiar with.
Alternatively, you may want to appeal directly to consumers or to those who are unfamiliar with your products by including product images and short descriptions. Your goals and target audience will shape what content is most fitting for your product table.
In your WordPress dashboard, navigate to WooCommerce > Settings and select the Product Table Ultimate tab:
In the Columns field, choose which columns you want to include in your one page order form. The possible values are sku, thumbnail, name, short-description, attributes, categories, tags, price, and add-to-cart.
Most of these options are fairly self-explanatory, but SKU (Stock Keeping Unit) numbers are identifiers that retailers use to internally track their inventories. SKUs can be particularly useful for repeat customers who regularly purchase the same items. Often, these customers can find the relevant item in your product catalogue much faster by searching for the associated SKU.
Step 2: Make It Easy to Bulk Order By Adding Quantity Selectors
Next, you can choose whether to display a quantity selector alongside each product. This gives customers the ability to bulk purchase an item in a single action.
You may want to consider adding a Quantity selector if you sell items that customers often purchase in bulk, or that you regularly run bulk buy discounts for. This feature can also make your store easier for wholesale customers to use.
To add a Quantity field, open the Show quantities on add-to-cart column dropdown in the WooCommerce Product Table Ultimate settings. Then select Yes.
You can also help customers add multiple unrelated products to their carts in a single action. According to neuroeconomics expert George Loewenstein, consumers prefer to complete their purchases as one easy transaction, rather than buying multiple items separately. By enabling this feature, you can improve your site’s customer experience while also encouraging conversions.
The WooCommerce Product Table Ultimate plugin has an Add Selected button that you can include in your one page order form. Simply select Enable add selected button > Yes. Customers will then be able to select all the items they want to purchase and add them to their carts with the click of a button.
Step 3: Add Your Variable Products and Decide How to Display Them
If your store features variable products, there are several ways to display them in your one page shop. One option is to redirect users to a separate product page when they click on a variable product to add it to their cart.
This method can be useful if you offer many customization options that would be difficult to include in a one page order form. It can also be an opportunity to improve the customer experience. For example, you might display a live preview that adapts as the customer builds their variable product.
To set up this redirect for variable products, select redirect to product page from the Variations Display dropdown menu in the WooCommerce Product Table Ultimate settings.
Alternatively, you can display the variable options as separate rows in your product table. With this setting enabled, each variation will appear like a separate product in your one page order form.
The third option is to choose the as dropdowns in parent row method. With this setting enabled, WooCommerce Product Table Ultimate will display variations as part of the parent product, with dropdown selectors for customers to specify which variation(s) they want to buy:
WooCommerce Product Table Ultimate has a wide range of settings that are worth exploring in detail. However, these are the ones required to launch a one page shop with WooCommerce. Once you’re happy with the information you’ve entered, click on Save Changes at the bottom of the Settings screen.
Step 4: Publish Your WooCommerce Product Table
All that’s left is to publish your one page order form on your site. You can add tables created with WooCommerce Product Table Ultimate to any page using a shortcode. This enables customers to view your entire catalogue, purchase products, and complete the checkout process from a single page on your website.
In your WordPress dashboard, find the page or post on which you would like to display your one page order form. Open it for editing, then add a new shortcode block:
[product_table_ultimate] into your shortcode block. Save your changes, and your one page order form should appear on your chosen page. If you want to give customers the option to purchase and check out from multiple locations, simply repeat the above steps to add more one page order forms to your e-commerce site.
If you’re building an e-commerce store, WooCommerce and WordPress are an effective solution. However, they’re also a popular choice. If you want to get ahead of the competition, you may need to enhance the WooCommerce platform with some additional features. By adding a one page order form to your site, you can streamline the shopping experience, particularly for bulk buyers and wholesale customers.
In this post, we’ve discussed how to create a one page order form using WooCommerce Product Table Ultimate in four simple steps:
- Build your one page order form by accessing the Settings screen and choosing which columns you want to include.
- Make it easy to bulk order by adding quantity selectors to your product table.
- Add your variable products and decide if you will redirect shoppers to product pages to select their variations, list each variation as a separate row in your table, or include variation selectors for each parent product.
- Publish your WooCommerce product table on any page using the [product_table_ultimate] shortcode.
Do you have questions about creating a one page order form for your WooCommerce website? Ask away in the comments section below!