All About CheckoutWC 7.0: Making WooCommerce Checkouts Better
Table of Contents
- Better Optional Address Fields
- A New Full Name Field
- Example 1:
- Example 2:
- Field Rendering Jujumagumbo
- Inline Postcode Validation
- Inline Email Domain Validation
- A New Login Flow
- The New Login Modal
- New Admin Settings Design
- House Number and Street Name
- When will CheckoutWC 7.0 launch?
- You can help test our beta.
We sent an email last week previewing some of the new functionality.
Today we are going to do a deeper dive and talk about all of the new features to expect in CheckoutWC 7.0.
Better Optional Address Fields
Sometimes the most exciting things are the little things. Optional address fields will now be hidden behind a link by default. Research indicates that users are often confused by fields such as Address Line 2, which are infrequently filled out and often filled out incorrectly.
By hiding these fields behind a link such as “Add Address Line 2 (optional)” or “Add Company (optional)”, we can reduce customer confusion and improve our conversion rates.
A New Full Name Field
Another area of usability we are addressing is the number of form inputs which can be especially costly to fill out on mobile.
Namely we are providing a new optional feature to combine the first and last name fields as a single Full Name field.
We parse the full name into the respective first and last name fields so everything else will work the same. And our parsing library understands a large variety of names.
Example 1:
Entered Full Name: Dr. David Livingston Jr.
First Name: David
Last Name: Livingston
Example 2:
Entered Full Name: Olivia de Havilland
First Name: Olivia
Last Name: de Havilland
We are excited to hear from customers like you on whether this boosts your conversion rates.
Field Rendering Jujumagumbo
7.0 also includes a big directional change regarding how we render fields. Since our first version, we used a separate function to render input field markup: cfw_form_field()
In 7.0, we are reversing course. We are using the raw input markup from woocommerce_form_field() and making minor adjustments to it. This should cleanup a lot of lingering edge cases where plugins expect fields to be rendered a certain way and then they are not rendered that way.
This should be completely invisible to the user.
Inline Postcode Validation
We have heard your feedback! The way we validate the shipping and billing post codes is not working.
Consequently, we’ve redesigned the whole process. This is how post code validation will work in 7.0:
Inline Email Domain Validation
How many times do you get an order where the customer entered the wrong email address, leaving you unable to reach out to them and leaving them frustrated, wondering where their receipt and updates are?
In 7.0 we’re going to help fix this by validating email addresses in real time. What we do is take the domain name from the email address and make a DNS request for the MX records associated with that domain. If no records come back, we display an error to the customer. It looks like this:
A New Login Flow
We are going back to the drawing board with logins.
As CheckoutWC has become more complex, we have started to question the usability of our login system. The way it works now is that if a user either enters a known email address that matches an account OR they click on ‘Login’, a Password field and Login button was revealed underneath the email address field.
This process worked pretty well, but it had some quirks. For example, when the login button was revealed, the email field functionally became a username OR email field. But it was still validated as an email field. This was confusing for some users.
On top of this, there were logistical issues with the other functionality that was co-located in that area of the form, such as creating an account and when to show a password field for that purpose.
The New Login Modal
Beneath the hood, there is more going on here.
- We’re still checking for existing accounts. If a user enters a known email address, we will open the login modal with their email address pre-filled. And we change the language: It looks like you already have an account. Please enter your login details below.
- Clicking “Lost your password?” seamlessly opens the Lost Password modal.
- We only prompt the user to login (by opening the modal automatically) once per 7 days.
New Admin Settings Design
We are not quite ready to demo this one, but we’re redesigning our admin pages again to be easier to navigate. We are organizing settings by category to keep like settings together.
We will share more about the new admin screens design soon.
House Number and Street Name
We are not quite ready to show this one, but we are working on a feature that our European friends frequently request: Separate house number and street name fields
It comes up a lot. We think we can solve this elegantly and help stop orders with missing house numbers.
When will CheckoutWC 7.0 launch?
We plan to launch 7.0 this coming Friday, February 25th Friday, March 4th.
You can help test our beta.
If you would like to help test our beta, just reach out to support and we will send you the latest build.
