How to Remove Order Notes (and other Fields) from Woocommerce Checkout

This was written for Woocommerce 2.2.8, but should also be applicable for future versions as well.

Woocommerce has been my preferred e-commerce platform for a couple of years now. I’ve built some beautiful stores with it, and I particularly love how it blends the ease of working with WordPress with the customizability of, well, working with WordPress!

Let’s say you want to alter some of the form fields shown to customers during checkout, though. There are a few ways you could go about it. The last one I’ll present here is what I would consider doing it the right way (skip to it), but I’ll review all three options to help make this happen for anyone, regardless of skill level.

The Cheap Way: Edit Some CSS

If you’re not comfortable editing your functions.php file and you don’t want to shell out any more money to purchase a license from Woo, this is probably the easiest way for you to remove certain fields. Say we want to remove the Customer Order Notes from checkout. You can simply hide it in the CSS. Open up your style.css file and paste in the following:

#order_comments_field {
display: none;
}

That should do it!

What’s wrong with doing it this way? Well, this method does work, but all you’re doing it hiding the field. Technically, anyone who knows how to use the Developer Tools (like Inspector bundled with Chrome) that come with most browsers these days can unhide it and still use it. That field is also loading in the HTML, so your code will be a bit more bloated (though the actual affect this would have on page speed is completely minimal). Mostly, it’s just not good development practice to just hide things that you don’t want on a page.

Also, note that you can’t remove any required fields this way. Trying to hide a required field (ie, those marked with an asterisk) will make the form impossible to submit by the user, as that field still exists, and Woo will not allow the form to go through without it being present.

So how can I do it the right way? By removing the field completely from the form!

The Expensive Way: Buy a Plugin

If you don’t want to edit the CSS and you don’t feel comfortable working with your functions.php file (though read on, it’s really quite simple), Woo does sell a plugin that gives you a lot of customization over the checkout fields.

It’s called Checkout Field Editor for Woocommerce and as of today, it’s $49 / year.

The Right Way! Free and Easy

Now I’ll show you how easy it is to just do the job right. Copy the code below and paste it into your functions.php file:

// remove Order Notes from checkout field in Woocommerce
add_filter( 'woocommerce_checkout_fields' , 'alter_woocommerce_checkout_fields' );
function alter_woocommerce_checkout_fields( $fields ) {
unset($fields['order']['order_comments']);
return $fields;
}

What that code says is: Add a filter to alter the checkout fields Woocommerce shows, and then specifically remove the order comments.

The $fields variable is passed through via the filter itself. In this example, we’ve completely removed the order comments from the checkout field.

What if we wanted to remove other fields?

Here is a complete list of fields you can remove. Note that I’m just adding additional unset() calls.

// remove Order Notes from checkout field in Woocommerce
add_filter( 'woocommerce_checkout_fields' , 'alter_woocommerce_checkout_fields' );
function alter_woocommerce_checkout_fields( $fields ) {
unset($fields['billing']['billing_first_name']); // remove the customer's First Name for billing
unset($fields['billing']['billing_last_name']); // remove the customer's last name for billing
unset($fields['billing']['billing_company']); // remove the option to enter in a company
unset($fields['billing']['billing_address_1']); // remove the first line of the address
unset($fields['billing']['billing_address_2']); // remove the second line of the address
unset($fields['billing']['billing_city']); // remove the billing city
unset($fields['billing']['billing_postcode']); // remove the ZIP / postal code field
unset($fields['billing']['billing_country']); // remove the billing country
unset($fields['billing']['billing_state']); // remove the billing state
unset($fields['billing']['billing_email']); // remove the billing email address - note that the customer may not get a receipt!
unset($fields['billing']['billing_phone']); // remove the option to enter in a billing phone number
unset($fields['shipping']['shipping_first_name']);
unset($fields['shipping']['shipping_last_name']);
unset($fields['shipping']['shipping_company']);
unset($fields['shipping']['shipping_address_1']);
unset($fields['shipping']['shipping_address_2']);
unset($fields['shipping']['shipping_city']);
unset($fields['shipping']['shipping_postcode']);
unset($fields['shipping']['shipping_country']);
unset($fields['shipping']['shipping_state']);
unset($fields['account']['account_username']); // removing this or the two fields below would prevent users from creating an account, which you can do via normal WordPress + Woocommerce capabilities anyway
unset($fields['account']['account_password']);
unset($fields['account']['account_password-2']);
unset($fields['order']['order_comments']); // removes the order comments / notes field
return $fields;
}

Up Next: Add Product Variation Select Directly to Woocommerce Shop, Category and Archive Pages