Checkout Fields

In this tutorial I will show you step by step how to add a file uploader field to WooCommerce checkout page without any plugins.

There are two type of fields in WooCommerce – billing and shipping fields (sorry for being so obvious). Some of the fields are presented in both of these categories, like a first name field or a country field. Some – may be presented in one of the categories only, like phone or email.

And now read carefully:

• We can make changes in the fields using hook woocommerce_default_address_fields – in this case the changes will affect everything – both edit billing and shipping fields pages in “My account” and the Checkout page as well.
• woocommerce_shipping_fields – the same, but affects only shipping fields
• woocommerce_billing_fields – the same, but affects only billing fields
• woocommerce_checkout_fields – affects only the checkout page, nothing else, this hook is already described in details in a separate tutorial.

I decided to publish a separate tutorial where we are going to talk about WooCommerce checkout form AJAX validation. Some of the fields in this form already has some default validation like email or zip-code validation, I will show you how to turn it off if you wish and how to add some custom validation rules as well.

This is all in one tutorial about WooCommerce checkout fields. We are going to edit WooCommerce checkout page by removing fields, renaming them, making them optional or required and of course, we are going to add a custom field to checkout as well.

Well, let’s get started. But first of all, let me introduce you woocommerce_checkout_fields filter hook. Most of the things we are going to do with its help.