In many cases, you don’t want to display all the default checkout fields in WooCommerce. In this article, I’ll show you how to hide or show checkout fields based on shipping method in WooCommerce.
To achieve that, you’ll need only one really powerful plugin - Flexible Checkout Fields PRO. It allows you to customize your checkout page, whether it’s adding new custom fields, deleting default ones or using it with conditional logic. Over 177,821 stores use this plugin on a daily basis and it’s well-rated with 4.6 out of 5 stars.
Flexible Checkout Fields PRO WooCommerce £59
Edit, add new or hide unnecessary fields from the checkout form. It's all about conversions and better user experience.
Add to cart or View DetailsYou can use this plugin to hide shipping fields for virtual products using conditional logic based on products or categories. But in this case, we are going to use conditional logic based on the shipping method. You can use it to hide checkout fields when your customer chooses Cash on Delivery (COD) shipping method or shipping to access points.
Hide checkout fields based on shipping method in WooCommerce
Let’s go to the practical part of this article. If you have your Flexible Checkout Fields PRO plugin installed and activated, go to WooCommerce > Checkout Fields.
Next, choose a section, where you want to hide checkout fields based on shipping method. It can be billing, shipping or any custom section available in Flexible Checkout Fields plugin.
Then, edit one of the fields that you want to hide. I’ll show it as an example of the City field, but it will work on any other one. When you have your field, go to Advanced settings.
Next, Enable Shipping Methods Logic and choose Hide this field if.
Now, it’s time to add a new rule. Click on Add rule button and you should see the new rule with two select fields.
In the first one, Select Shipping Zone, you can choose the shipping zone that includes your shipping method. Only shipping methods from that shipping zone will be displayed in the second field. In my case, it’s the USA.
In the second field, Select Shipping Method, choose your shipping methods. If you are using our Flexible Shipping plugin, you’ll see shipping methods with “Flexible Shipping:” prefix. In my example, I chose Advanced shipping.
Now, you can apply the same rules to other checkout fields that you want to hide. Remember to Save Changes.
Result
That’s how it looks like in my store.
As you can see, after I choose the Advanced shipping method, the City field is no longer displayed. It will work also with other fields.
Learn more about WooCommerce Checkout Conditional Fields →
Summary
In this article, I showed you how to hide checkout fields based on shipping method in WooCommerce. You can also use it to display checkout fields only for certain shipping methods. I hope it will be useful.