WooCommerce – How to Remove Checkout Fields? (with video)

Remove Checkout Fields

The checkout page of an eCommerce store plays an important role in customer experience. In this article, we will discuss how you can remove fields and personalize the checkout page.

When customers are on the checkout page, they will see different fields to be filled in before making the purchase. WooCommerce displays a set of fields on the checkout page by default. Depending on the nature of your business, you can hide some of these fields using the WooCommerce Customizer. Let’s see how…

Removing checkout fields using WooCommerce Customizer

Navigate to the WooCommerce Customizer from the WordPress admin panel through Appearance > Customize > WooCommerce > Checkout.

You can remove three fields from the checkout page here. These are Company name field; Address line 2 field; and phone field. Select ‘Hidden’ option from the drop-down for all three fields.

Click the Publish button. Now you can see these three fields are removed from the checkout page.

You can remove three fields from the checkout page using the default WooCommerce customizer.

However, you may want to hide other fields on the checkout page as well. For example, if you are selling downloads, you may want to delete the address fields altogether. Let’s see how we can do this.

Using a code snippet to remove checkout fields

You can add the below code snippet to the Functions.php file of your theme. This will remove all the possible fields from your checkout page. You will have to make changes to the snippet according to your specific need.

/**
Remove all possible fields
**/
function wc_remove_checkout_fields( $fields ) {
// Billing fields
unset( $fields['billing']['billing_company'] );
unset( $fields['billing']['billing_email'] );
unset( $fields['billing']['billing_phone'] );
unset( $fields['billing']['billing_state'] );
unset( $fields['billing']['billing_first_name'] );
unset( $fields['billing']['billing_last_name'] );
unset( $fields['billing']['billing_address_1'] );
unset( $fields['billing']['billing_address_2'] );
unset( $fields['billing']['billing_city'] );
unset( $fields['billing']['billing_postcode'] );
// Shipping fields
unset( $fields['shipping']['shipping_company'] );
unset( $fields['shipping']['shipping_phone'] );
unset( $fields['shipping']['shipping_state'] );
unset( $fields['shipping']['shipping_first_name'] );
unset( $fields['shipping']['shipping_last_name'] );
unset( $fields['shipping']['shipping_address_1'] );
unset( $fields['shipping']['shipping_address_2'] );
unset( $fields['shipping']['shipping_city'] );
unset( $fields['shipping']['shipping_postcode'] );
// Order fields
unset( $fields['order']['order_comments'] );
return $fields;
}
add_filter( 'woocommerce_checkout_fields', 'wc_remove_checkout_fields' );

Edit the snippet according to your requirement so that the correct fields are removed.

If you are not sure about how to update a code snippet in the Theme functions file, refer to our article with video explaining the process of updating code snippets on your WordPress site.

For example, we have edited the code snippet so that it will remove the address fields from the checkout page.
/**
Remove all possible fields
**/
function wc_remove_checkout_fields( $fields ) {
// Billing fields
unset( $fields['billing']['billing_state'] );
unset( $fields['billing']['billing_address_1'] );
unset( $fields['billing']['billing_address_2'] );
unset( $fields['billing']['billing_city'] );
unset( $fields['billing']['billing_postcode'] );
return $fields;
}
add_filter( 'woocommerce_checkout_fields', 'wc_remove_checkout_fields' );

Copy the snippet and add it at the end of your Functions.php file. Once you save the file, you will see the address fields are removed from the checkout page.

Using the Checkout field editor plugin

If editing the theme functions file is too complicated for you, then you can try the Checkout Field Editor plugin.

image of ThemeHigh WooCommerce checkout field editor
If you are looking for a free option to add, edit or remove checkout fields on your WooCommerce store, this one is probably a good option to try out.

First, you have to install and activate the plugin. On the plugin settings page, you can specify the fields to be removed. For this example, we will remove the ‘last name’ field. Click the checkbox next to the billing last name field and click the Remove button. Then click the Save changes button. Now, customers on the checkout page will not see the last name field.

With the help of this plugin, you can easily remove any fields you want from the checkout page.

This way you can remove any field of your choice from the checkout page. The plugin also helps you add new fields as well as reorganize the order of display.

Hopefully this article will help you remove different fields and personalize your checkout page for an optimized experience for your customers.

Further reading

LEAVE A REPLY