Customizing the WooCommerce Checkout Page

How to Customize the WooCommerce Checkout Page

Many questions related to customizing the WooCommerce checkout page have been brought up recently.  As you’ll soon see it is possible to modify fields in the checkout page without spending money on expensive extensions for WooCommerce.  However, before we dive into the details I want to share a quick story to help put it all in perspective.

Way back in 2007 I got my start in the eCommerce business.  I was fresh out of college and knew very little about average order size, payment gateways, SSL certificates or any of the standard eCommerce jargon.  Somehow I was able to land a job as an account manager with an up-and-coming software as a service company.  Their main product was a custom eCommerce platform for small to mid-sized businesses.  I soon found myself working directly with the two guys that owned the company.  Stress levels were high but looking back at it now, the knowledge gained was worth it.

In working with hundreds of clients (over a 2 year period) I learned that no two eCommerce sites were the same.  Each had their own unique characteristics and needs especially in regards to the checkout process.  The out of the box checkout page we had was a starting point but our clients were always looking to customize the fields within it to fit their specific needs.

That was more than five years ago and at the time, making updates to fields on the checkout page was a process to say the least.  Being the middle-man, I had to determine the changes our clients wanted to make and then communicate that to our in-house developers.  They would then give me an estimate of how long it would take, how much it would cost and when they could get started which I would have to communicate back to the client.

My point in telling you that short story is that customizing the checkout page of an eCommerce site used to be a big deal that took time and money.  However, thanks to the combination of WordPress and WooCommerce it’s now easy to customize fields on the checkout page of your eCommerce site.

In this tutorial on customizing the WooCommerce checkout page we’ll show you how to do the following;

  • create a child theme and functions.php file to ensure your customizations are saved
  • modify field labels and placeholder text
  • remove fields
  • add custom fields
  • make fields not required or required

Monarch Social Sharing Plugin


Create a Child Theme before making WooCommerce Checkout Modifications

Customizing the WooCommerce checkout page is a matter of making modifications to your themes functions.php file.  Hooking into the woocommerce_checkout_fields filter allows us to modify any fields on the checkout page.  However, before we jump into the customization details we need to first talk about the correct way to make updates via the use of child themes.

It’s very important that you first install a child theme and make updates to the functions.php file within it.  Do not make updates to the parent files because all customizations will be lost when you upgrade to the latest version of your theme.  The use of a child theme ensures that your hard work is preserved.

So start by reviewing our “Safely Customize your Site with Child Themes” tutorial to learn how to create a child theme (for any theme).  After your child theme has been created you need to add a functions.php file to it.


Need a WooCommerce Order Status & Actions Manager Plugin? (Affiliate  link)

[captainform i735020 lightbox=”1″ url=”” type=”image”]

Here’s how add a functions.php file to your Child Theme

Now that you have a child theme you need to go one step further and create a functions.php file.  The functions.php file for the child theme simply consists of PHP open and close tags as shown here…

Child Theme Functions.php file

Copy and paste the following into Notepad++ to create the functions.php file and upload it to the root of your Child theme…

/* All child theme functions go here
———————————————– */

Make sure to save the file as “functions.php”.  All customizations will go in-between the PHP open and close tags.  You’re now ready to properly make updates to the WooCommerce checkout page.

Watch the tutorial video below to learn how to create a child theme (and add a functions.php file to it) so that your WooCommerce checkout page customizations will be saved when you upgrade to the latest version of your theme…

How to Change WooCommerce Checkout Field Labels, Placeholder text and Remove Fields Entirely

Now that you know how to properly make updates to your site via the use of child themes, let’s dive into customizing the WooCommerce checkout page.  Specifically, let’s start by learning how to change field labels and the placeholder text within the fields.  We’ll end this segment by showing you how to remove fields from the checkout page entirely.

Monarch Social Sharing Plugin

Customizing WooCommerce Checkout Field Labels and Placeholder Text

Let’s start by showing you how to change WooCommerce checkout field labels and the placeholder text within the fields.  We’ll use the “Order Notes” field as our first example.  Say we want to change the default label (Order Notes) and the placeholder (Notes about your order, e.g. special notes for delivery) to something new.

To modify the Order Notes field Label and the Placeholder text do the following…

In the WordPress admin go to Appearance > Editor > functions.php of your child theme > paste the following code between the PHP open and close tags…

// Hook in
add_filter( ‘woocommerce_checkout_fields’ , ‘custom_override_checkout_fields’ );

// Our hooked in function – $fields is passed via the filter!
function custom_override_checkout_fields( $fields ) {
$fields[‘order’][‘order_comments’][‘placeholder’] = ‘My new placeholder’;
$fields[‘order’][‘order_comments’][‘label’] = ‘My new label’;
return $fields;

Here’s what that will look like on the WooCommerce checkout page…

Change Order Notes field Label and Placeholder

You can change the label as well as the placeholder to anything you’d like by modifying the “My new placeholder” and “My new label” text in the code above.

In addition to the “Order Notes” field, it is possible to modify the label and placeholder for any fields on the checkout page and here’s how to do that…

Let’s say we want to change the “Company Name” field label and add a placeholder to it.  We would do that by making a few simple tweaks to the hook as shown below…

// Hook in
add_filter( ‘woocommerce_checkout_fields’ , ‘custom_override_checkout_fields’ );

// Our hooked in function – $fields is passed via the filter!
function custom_override_checkout_fields( $fields ) {
$fields[‘billing’][‘billing_company’][‘placeholder’] = ‘Enter Company Name’;
$fields[‘billing’][‘billing_company’][‘label’] = ‘Business Name’;
return $fields;

Here’s what that update looks like on our WooCommerce demo site…

How to Change "Company Name" field

Shipping Address field labels and placeholders are changed in the same way.  For example, you could change the “Address” field label to “Shipping Address” and placeholder to “Enter your Shipping Address” with the following PHP snippet…

// Hook in
add_filter( ‘woocommerce_checkout_fields’ , ‘custom_override_checkout_fields’ );

// Our hooked in function – $fields is passed via the filter!
function custom_override_checkout_fields( $fields ) {
$fields[‘shipping’][‘shipping_address_1’][‘placeholder’] = ‘Enter your Shipping Address’;
$fields[‘shipping’][‘shipping_address_1’][‘label’] = ‘Shipping Address’;
return $fields;

Here’s a screen capture of what that looks like on the Checkout page of our demo site…

Change "Address" field label to "Shipping Address"

So you can use that same snippet of PHP to change the labels and placeholders for any of the checkout fields.

Bloom Email Optin Plugin

How to Remove Fields from the WooCommerce Checkout Page

Now lets take a look at how to remove fields entirely from the WooCommerce checkout page.  Again lets use the “Order Notes” field in our first example.  Say we want to remove the field from the checkout page.  To remove the Order Notes field paste the following hook between the PHP open and close tags…

// Hook in
add_filter( ‘woocommerce_checkout_fields’ , ‘custom_override_checkout_fields’ );

// Our hooked in function – $fields is passed via the filter!
function custom_override_checkout_fields( $fields ) {

return $fields;

Here’s what that looks like on our demo site…

How to Remove the "Order Notes" field from Checkout page

If you want to remove multiple fields from the checkout page simply add additional “unset($fields” to the hook.  For example, say you wanted to remove the Order Comments, Phone and Email fields.  You would copy/paste the following code into the functions.php file within your child theme…

// Hook in
add_filter( ‘woocommerce_checkout_fields’ , ‘custom_override_checkout_fields’ );

// Our hooked in function – $fields is passed via the filter!
function custom_override_checkout_fields( $fields ) {

return $fields;

Here’s what that modification to the checkout page looks like on our demo site…

Remove Multiple Fields from WooCommerce Checkout page

Here’s the full list of WooCommerce fields.  Use this list to modify any fields on the checkout page…

Full List of fields in the array passed to woocommerce_checkout_fields

Take a few minutes to watch our tutorial video below which demonstrates how to do the following…

  • Modify WooCommerce Checkout field labels and placeholder text
  • Remove any of the fields on the WooCommerce checkout page

Adding Custom Fields to the WooCommerce Checkout Page

Every business has its own unique traits and in many cases that requires adding custom fields to the checkout.  The good news is that with WooCommerce it’s easy to add functional, custom fields to the checkout process.  In fact, it’s as simple as copying the PHP snippet below and pasting it into the functions.php file within your child theme.

To add a custom field to your checkout copy/paste the following code in your child theme functions.php file…

add custom field to woocomm checkout

Here’s a screen capture of what it looks like on our demo site…

How to add a custom field to WooCommerce checkout

Watch the video below to learn how to add special custom fields to the WooCommerce checkout page.  They will show up when you look at the Order Details in the WordPress admin…

Bloom Email Optin Plugin

How to Make WooCommerce Checkout Fields Required or Not Required

At this point, you’ve learned how to change field labels, placeholders, add custom fields and remove fields altogether.  The last thing I want to show you is how to make WooCommerce checkout fields not required or required depending on the specific needs of your WordPress powered eCommerce site.

It’s possible to make any of the WooCommerce checkout fields required or not required.  The important thing to note is that “true” makes the field required and “false” makes it not required.

For example, to make the Billing Address “Phone” field not required paste the following code between the PHP open and close tags in the functions.php file of your child theme…

add_filter( ‘woocommerce_billing_fields’, ‘wc_npr_filter_phone’, 10, 1 );

function wc_npr_filter_phone( $address_fields ) {
$address_fields[‘billing_phone’][‘required’] = false;
return $address_fields;

Below is a screen capture of what it looks like on our demo site when we make the Billing Address “Phone” field not required…

Make Billing Address "Phone" field not required

Here’s how to make a field that is not require, required.  Take the Shipping Address “Company Name” field for example.  Let’s say we want to make that field required.  Using a slightly modified version of the same snippet of code as above we can change the Shipping Address “Company Name” field to required and here’s how…

add_filter( ‘woocommerce_shipping_fields’, ‘wc_npr_filter_company’, 10, 1 );

function wc_npr_filter_company( $address_fields ) {
$address_fields[‘shipping_company’][‘required’] = true;
return $address_fields;

Pasting the above code between the PHP open and close tags in the functions.php file of your child theme will result in the following…

How to make checkout field required

Take a few minutes to watch our tutorial video below to see how to make WooCommerce checkout fields not required or to make them required…

For your reference:

  • Learn more about the importance of using child themes when customizing your WordPress site here, “Why use a Child Theme
  • To learn more about how checkout fields are loaded into WooCommerce refer to WooThemes documentation on “Customizing checkout fields using actions and filters
  • We use a Mystile Child theme in the videos above, however, this will work with any theme
  • The process for creating a child theme is the same for all themes

Please use the new Upload WP Community Forums to post questions and comments on Customizing the WooCommerce Checkout page.  Thanks


[captainform i735020 lightbox=”1″ url=”” type=”image”]

348 thoughts on “Customizing the WooCommerce Checkout Page

  1. Thank you very much Adam for this tutorial. Again I find them so helpfull and usefull! Thanks for the time given.
    I havn’t cerated a child theme so fare, doing my changes in custom.css. But my concern is the changes I’ve done in the Woocommerce template. I’ve modifyed some php pages in it. What will hapen if I update woocommerce plugin? Is it possible to do something like a child theme to save the changes?

    • Hi Amelie,

      Thanks for letting me know that our WooCommerce tutorials have been useful. The updates that you’ve made in the custom.css box in the Theme Options > Display Options > General settings should be fine when you update to the latest version of WooCommerce. Going forward however, you should install and use a child theme to ensure your updates are saved. Here is the link to download the Mystile Child theme we created. Simply download it, unzip it > upload it like you would any other theme > activate it and any changes you make to the style sheet and/or functions.php will be preserved when you upgrade to the latest version of you theme…

      Click the link below to download our Mystile Child theme…

  2. Thanks Adam, I find your tutorials very useful. However I have a problem when activating the child theme on my wootique theme. After activating the child theme, everything looks normal except the content background suddenly shrinks up at the back from its content (seems like its unable to load the sidebar-right.png). Maybe it will be better if I can let you take a look at my screenshot. Not too sure if you can help on this. Thanks.

  3. Adam, Your site has provided immense help to me over the past two weeks as I’ve been trying to build my ecommerce site using Mystile and Woocommerce. Thank you. I’m now trying to figure out the final elements for my site and am stumped. I sell photo engraved pendants and want the customer to choose a pendant shape then have the opportunity (probably in cart, not checkout, right?) to input the text they want engraved, choose a font style, and upload their photo. Do you have experience with the gravity form plug-in
    and if so, do you think this is the right investment for me to accomplish what I need?

    • Hi Karin,

      I have used the Gravity Forms plugin in the past and was really happy with it. Actually, I used it on a clients site (it was a business style WordPress site) a couple years ago and they were very pleased with it as well. I’ve not yet used Gravity Forms in conjunction with WooCommerce but my guess is that it will give you the functionality that you need.

      Here’s a tutorial video I found on YouTube that shows you “How to setup Gravity Forms with WooCommerce“…

      Please let me know if this helps and thanks for the positive feedback on our WooCommerce tutorials!


  4. Hi Adam

    Firstly, many thanks for all the effort you’ve put in to put the tutorials together here and on YouTube. I’ve been working my way through them this week and the pace at which you explain is perfect to follow.

    My question is, what widget did you use for the Subscribe (email) in the right hand column?

  5. Hi Adam,

    I haven’t found a solution yet, so I will ask you here on your website, as you told me on YouTube.
    I hope you have an idea how to help me. 🙂


    Hey Adam!

    Thanks for many great videos! It really helped me build my WooStore. Right now I’m learning to build a store – and I just reinstalled WordPress, WooCommerce and WooStore at my domain to try it all again.

    There is just a problem, that I don’t know how to fix.
    My store-buttom is mixed up. It is in three parts – and is not looking like your at at all.

    I have uploaded a screenshot to my website at:

    Can you tell me how to change that?

    There is also another fail on the page, which also is a fail at The (+) & (-)-button does not work as it should. If I use my iPhone it does work, but with safari and FireFox it does not. Look at the second picture at

    Can I remove this function? My customers can’t buy more than one at a time, so it would be great if I could remove it.

    I hope you can help me. (-:

    Best regards
    Mikkel Hansen

    • Hi Mikkel,

      Thanks for your questions regarding the WooStore theme and for the positive feedback on our WooCommerce tutorials. In regards to your second question with the plus and minus buttons not working with WooStore… Are you referring to them not working on the product detail page, the shopping cart or both? I just tested in Firefox and Chrome and could not recreate the issue. The + and – buttons worked properly on the product detail page and in the shopping cart page.

      I took a look at the screen shot you provided and see what you mean in regards to the shopping cart button showing up in 3 places in the top navigation. Without looking in the WordPress admin, it’s difficult to say what might be causing that issue.

      My suggestion would be to go to and search for “WordPress” > you’ll find a bunch of gigs that will help fix any WordPress or CSS related issue > give one of them a try. For $5 you can usually get any issue fixed. I often use Fiverr when I have issues that I can’t figure out on my sites and it almost always works.

      However, before going to Fiverr, I’d be happy to take a closer look at your site. If you want to create a user login so that I can access your WordPress admin I will try to fix the issues. The “Contact” form in the footer of goes to my email. So if you want to create a user account for me to login and send me the info via the Contact page form I will do my best to help. Thanks.

      p.s. here’s the link to our Contact page

  6. Hi Adam,

    This is a fantastic article, and has given me great insight in to what I’m working on at the moment.
    I’m trying to add some custom fields to the checkout page which I have got working now after reading your article. However I want these fields to appear only when the product category of the products in the cart is (‘Subscriptions’).
    Is there a way to show these custom fields conditionally based on the product?

    Thank you

    • Hey Sam,

      That is a great question. I’m honestly not sure if it’s possible to conditionally show your custom fields based on the product that’s being purchased. I will have to do some research and testing on that one before I can say it is or is not possible. In the meantime, I’m going to go ahead and publish your comment with the hopes that someone else out there might know the answer and share it with us.

      Thanks again for your question and for letting me know the info on Upload WP has been helpful. Your support is very much appreciated.


      • Adam,
        Thanks this article has been very helpful!

        I am trying to do the same thing Sam asked about. I have a digital product that has a free trial version. I want them both to run through woocommerce so I can set up the followup emails properly & keep all orders in the same database. However on the free trial download, I want to only require a name and email.

        Your tutorial has helped me figure out how to do this, however I only want to omit fields on one product.

        Do you have suggestions on how to do this?

        • Hey Lisa, Great question and I’m glad to hear that the videos have helped. Without having time right now to do some research / testing I’m honestly not sure if its possible to omit certain woocommerce checkout fields based on the product being purchased. It very well may be possible and there is a good chance that someone else out there reading this has a solution. So I will go ahead and publish this comment and ask for feedback / suggestions from our readers. Thanks for your support and positive feedback Lisa.


  7. Hi Teddy,

    A very nice and comprehensive tutorial there. But I wanted to achieve a little more checkout page customization. I don’t want to overwhelm a customer with so many fields hence my boss wants me to completely remove shipping portion, I’d be extremely happy if you could explain me that.


  8. Okay, I am a total newbie.
    Your first instruction is:
    “All that you need to create a child theme is access to the directory in which your WordPress site is stored and a text editor (Notepad++ for Windows works great, as does Text Wrangler for Mac.)”
    Is the directory you are referring to on my host site, or the WordPress admin location? Thanks in advance,

    • That’s a good question. I’m honestly not sure if or how to make the “Have a Coupon?” option required. I’ll look further into it asap and let you know what I find.

      If anyone else out there knows how to make the Coupon field required on the WooCommerce Checkout page please share it with us here.



  9. Thanks Teddy Triton, You have indeed helped me a lot in the customization of my checkout page, however am having issues with the fields i added. They are not showing in the users page or the mail sent to me. Thus its really affecting me as i cant tell which of the fields value were selected. I would appreciate if you can help in this regards. Thank you so much as i await your response.

  10. Hi Teddy,

    Thanks for this awesome tutorial! It helped me alot, but now i need to change the order of the checkout-elements.
    I’m German and because of the annoying german rules for shops the “order”-button needs to be directly after the price. This meens, that i have to put before the table, where the products are listed.
    Could you tell me what I have to do to solve this problem?

    Thanks for an answer!

    • Hi Luke,

      Thanks for letting us know that our WooCommerce tutorials have been helpful. Positive feedback like that keeps us motivated to make more tutorials. In regards to your question on moving the “order” button so that it appears directly after the price… I have a couple follow up questions that will help me understand exactly what you’re trying to do.

      On which page(s) does the Order button (I’m assuming by Order button you mean “Add to Cart”) need to show up directly after the price? In other words, does it need to show on the /shop page and the product detail pages? Or just at the product detail level? Please specify the pages that you need this modification on.

      Also, what theme are you using?

      Please provide more specific info and we’ll do our best to help. Thanks again for the positive feedback.


      • First of all, sorry for my late answer and thanks for your answer.

        What I meant was the checkout page. Normally you fill in your address and so on. At the end of the page there’s a table in which the products that you will buy are listed.
        Next to the final-price is the selection-area for the payment.
        And then, there is the button “Buy”.

        Now I would like to have the payment selection before the table. The “Buy” button will then be directly under the final price.

        Thanks again for your help, Luke

  11. Hi Adam – Really GREAT tutorials, I have some familiarity with WP, but had never had an e-commerce site and was really nervous about it. Your tutorials here and on YouTube were amazingly helpful and I’m off to a good start. However, my site is very basic, it’s a site providing transcription services, very few actual products and all virtual, however, I need customers to be able to upload a file or provide a link during the order process, and then we provide them with the completed Word doc when the order is completed.

    I am not as concerned about getting the completed file to the customer as I am with the upload at the checkout process. The customer can use the order notes to place any instructions or a URL, and ideally, I would like a file upload option just below the order notes box.

    I’ve been doing research, and I found this extension:

    And I wondered if you were familiar with it, or if you think this would be an appropriate extension to provide an upload file box/field on the checkout page. I did try several free plugins that supposedly provided this feature, but they simply didn’t work, or provided the upload option on the order status page, which yes, would be an option, but seems very awkward for the customer to complete an order and then have to go to the order status page to then upload the file.

    If you have any familiarity with this extension, I would really appreciate your input. If you know of any other way of accomplishing what I need, I’m definitely open to suggestions.

    Thank you SO much for all your help and great tutorials!

    • Hi Beth,

      Thank you very much for the positive feedback in regards to our WooCommerce tutorials. I’m happy to hear that they have been helpful and it keeps me motivated to make more.

      Regarding adding upload functionality to the checkout page…

      I’ve not had a chance to test the Product Add-ons extension for WooCommerce. However, I just read through the description and it looks like it should work well for what you’re doing if your OK with the upload and Special notes option being on the Product Detail Page and Not on the WooCommerce Checkout page. From what I can tell, the Product Add-ons extension shows up at the product detail level. If that’s OK with you, then this extension should work great. My suggestion would be to contact their support and ask if it’s possible to use this extension on the Checkout page or if it only works at the product detail level.

      Thanks again for the positive feedback and please let me know if I can help with anything going forward.


      • Thanks for the great feedback and comments on the Product Add-ons. Especially for pointing out that it would not be on the checkout page, which I had not noticed, but I think that being on the product detail page may work out just fine.

        Thanks again!!

  12. Hi, Thanks for the help on this, saved me some money from buying the extension :o)
    I have a quetion though, I am trying to make my custom field to be required and add this code

    add_filter( ‘woocommerce_shipping_fields’, ‘wc_npr_filter_my_custom_checkout_field’, 10, 1 );

    function wc_npr_filter_my_custom_checkout_field( $address_fields ) {
    $address_fields[‘shipping_my_custom_checkout_field’][‘required’] = true;
    return $address_fields;

    but can not seem to get it to work, any help? Thanks!

    • Hi Chris,

      Thanks for your question and for letting us know this WooCommerce tutorial was helpful. When you paste the code in the functions.php of your child theme does the custom field show up but the field isn’t required? Or, does the custom field not show up at all? Also, what is the URL to your site so I can take a closer look? Let me know and I’ll test it out on one of our WooCommerce demo site and try to get it to work.



  13. Excellent, this is what I was looking for. Unbelievable that Woocommerce doesn’t support this from the get-go. Thanks so so much!
    One question: how would you code a checkbox or radiobutton?
    I want to add an option to the checkout procedure where customers choose if they want to receive a newsletter or not.
    Making a customfield to just add their emailaddress is a bit silly since they already enter their emailaddress in a different field.
    Any clue on how to achieve this?

  14. Great tutorial Teddy.
    I am kind of new to woocommerce and really looking for something similar, however, in my case I just want to show special information about the product (e.g this purchase will grant you 30 stars credit), show it in the product page, checkout page and emailed to the client. it seems very simple to me but I can’t find a good answer. in your tutorial you demonstrate using a custom field (my field) and show it on the checkout page but you use an input filed. I only want to show short note to the customer without him being able to edit it. is that possible?


  15. Thanks for tutorial. That’s really amazing. I have a question, though. I added multiple custom fields, but only one of them are showing up when someone orders something from the shop.

    And As I tried to add this code:

    * Add the field to the checkout

    three times, because I want to add three fields, my website crashed. So in a nutshell could you tell me is there any way to insert more than one fields which will work?

    • Please scratch the previous post. Had to correct a few things..

      * Add the field to the checkout 1 + 2
      add_action('woocommerce_after_order_notes', 'my_custom_checkout_field');

      function my_custom_checkout_field( $checkout ) {

      echo '<div id="my_custom_checkout_field"><h3>'.__('Titel Text').'</h3>';

      woocommerce_form_field( 'THIS_IS_FIELD_1', array(
      'type' => 'text',
      'class' => array('my-field-class form-row-wide'),
      'label' => __('Label Text 1 <abbr class="required" title="required">*</abbr>'),
      'placeholder' => __('Placeholder Text 1'),
      ), $checkout->get_value( 'THIS_IS_FIELD_1' ));

      woocommerce_form_field( 'THIS_IS_FIELD_2', array(
      'type' => 'text',
      'class' => array('my-field-class form-row-wide'),
      'label' => __('Label Text 2 <abbr class="required" title="required">*</abbr>'),
      'placeholder' => __('Placeholder Text 2'),
      ), $checkout->get_value( 'THIS_IS_FIELD_2' ));

      echo '</div>';


      * Process the checkout 1 + 2
      add_action('woocommerce_checkout_process', 'THIS_IS_FIELD_1_PROCESS');

      function THIS_IS_FIELD_1_PROCESS() {
      global $woocommerce;

      // Check if set, if its not set add an error.
      if (!$_POST['THIS_IS_FIELD_1'])
      $woocommerce->add_error( __('<b>Field 1</b> is a required field.') );

      add_action('woocommerce_checkout_process', 'THIS_IS_FIELD_2_PROCESS');

      function THIS_IS_FIELD_2_PROCESS() {
      global $woocommerce;

      if (!$_POST['THIS_IS_FIELD_2'])
      $woocommerce->add_error( __('<b>Field 2</b> is a required field.') );

      * Update the order meta with field value 1 + 2
      add_action('woocommerce_checkout_update_order_meta', 'THIS_IS_FIELD_1_UPDATE');

      function THIS_IS_FIELD_1_UPDATE( $order_id ) {
      if ($_POST['THIS_IS_FIELD_1']) update_post_meta( $order_id, 'Field 1 Text', esc_attr($_POST['THIS_IS_FIELD_1']));

      add_action('woocommerce_checkout_update_order_meta', 'THIS_IS_FIELD_2_UPDATE');

      function THIS_IS_FIELD_2_UPDATE( $order_id ) {
      if ($_POST['THIS_IS_FIELD_2']) update_post_meta( $order_id, 'Field 2 Text', esc_attr($_POST['THIS_IS_FIELD_2']));

      * Add the field to order emails 1 + 2
      add_filter('woocommerce_email_order_meta_keys', 'THIS_IS_FIELD_1_EMAIL');

      function webpresentatie_titel_order_meta_keys( $keys ) {
      $keys[] = 'Field 1 Text';
      return $keys;

      add_filter('woocommerce_email_order_meta_keys', 'THIS_IS_FIELD_2_EMAIL');

      function webpresentatie_subtitel_order_meta_keys( $keys ) {
      $keys[] = 'Field 2 Text';
      return $keys;

      • Hi Rafael,
        Thanks for this code! I wanted to add multiple custom fields to my checkout, and this code works well UNTIL I get to the "add to order emails" code. This part of the code breaks my site completely, both front- and back-end – I have to go into cPanel to change the code back. I'd definitely like the custom fields I've added to show up in order emails, so I'd really like to get this to work. I thought there might be a problem with the "webpresentatie_titel" part of the code, and I changed this to "woocommerce_email" – that didn't work. Can you or anyone else out there let me know how to fix this code, or provide alternative code so that the custom field text is added to order emails? Many thanks!!

        • Never mind! I figured out the code for adding custom fields to order emails myself! It should be (at least this works for me..):

          * Add the field to order emails
          add_filter('woocommerce_email_order_meta_keys', 'THIS_IS_FIELD_1_order_meta_keys');

          function THIS_IS_FIELD_1_order_meta_keys( $keys ) {
          $keys[] = 'FIELD 1 Description';
          return $keys;

          add_filter('woocommerce_email_order_meta_keys', 'THIS_IS_FIELD_2_order_meta_keys');

          function THIS_IS_FIELD_2_order_meta_keys( $keys ) {
          $keys[] = 'FIELD 2 Description';
          return $keys;

      • Wow some create coding and great information here, however
        what no one seems to has answered is what code do you put in the admin_new_order.php file for these fields to show.
        I get the code working so it shows and seems to work on the checkout page as suggested, however Nothing shows on the email itself.

        Any suggestions please

  16. Thank you for the great tutorial. I was wondering how I could make these custom fields editable to customers after they placed an order? Kind of like they can update their billing or shipping address, I would like them to be able to update the custom fields associated with their order.

  17. Hello, and thanks for this really good tutorial! It helped me a lot!

    I just have one question.

    I want to change the size of some of the checkout fields. So instead of 2 on 1 line, I remove one of the fields, and the other one should be wide. How can I do that?

    Thank you 🙂

    • Hi Tim – I’m glad to hear that our WooCommerce tutorials have been helpful. Thanks for the positive feedback and for your question. I’m not sure how to widen checkout fields without spending some time playing around with it. I’ll spend some time working on it this weekend.

      If anyone out there knows how to change the size of WooCommerce checkout fields please share it with us here. Thanks,


  18. Thank you for such detailed information and responding to your readers.
    I hope you can provide some insight on the WooCommerce API.
    I want to validate some fields in a variable product.
    Specifically, I want to make sure the buyer selected the right quantity available of each variation.
    Most of the interactions I have seen with the content of the cart are happening with filter hooks. However, I don’t think those allow one to essentially validate the moment. I might be able to change a value, but I can’t display an error message and go back to the cart.

    Am I correct in thinking that I need to add an action for that, something like

    add_action(‘woocommerce_checkout_process’, ‘my_custom_checkout_field_process’);

    function my_custom_checkout_field_process() {
    global $woocommerce;
    If the fields fail the test, redirect to the cart
    If this is not the proper place to validate the cart, is there a better way?


    • Hi John,

      I appreciate the positive feedback on our tutorials. You raise a great question on validating WooCommerce checkout fields for variable products. Off the top of my head I’m honestly not sure in regards to adding an action. I’ll need to do some research and testing before I can give you a reliable answer. In the meantime, I will go ahead and publish your comment with the hope that there is someone out there that can chime in with a good answer. I’ll update this comment after I’ve had some time to look further into it.

      Thanks again for your support,


  19. Thank you so much. This helped me heaps and saved me cash! I removed all the billing address and phone details. Is there any reason why I would need them if I am only accepting payments through PayPal?

    • Thanks for letting me know this tutorial was helpful John. If you're using PayPal to process orders then you can really streamline the checkout which it sounds like you've done that. Best of luck with your site and let me know if I can help with anything going forward.


  20. Hey Teddy, thank you very much! That's a very good tutorial. One of the best i've seen so far! Good work!

    I've just one small question, is there a way to set a field value like that?

    $fields['billing']['billing_company']['value'] = 'My new value';

    Like setting a value by default? I tried 'value' and 'text' but that didn't work.

    • Hi Simon,

      First of all, thank you for the super positive feedback on this WooCommerce checkout page tutorial. Your support is very much appreciated. I'm not sure that I'm completely understanding your question in terms of the type of field you'd like to add to the checkout page. Please provide some more detail in terms of what you're looking to do and I'll try to figure out a good solution.

      Thanks again,


  21. Terrific tutorials. Thanks for these

    I have the same question I have seen asked but not yet answered… How to get custom fields to appear in emails, etc

    I added custom fields to check out. ( delivery and pickup dates for a rental company) but they are not appearing in the emails confirming the order or any other documents (invoice, delivery note, email notification of new order). I see the fields within the order data in the woocommerce admin panel.

    Do you have a video on this?

    • Hi Mary – thanks for the complements on our WooCommerce tutorials. Regarding you're question on getting custom WooCommerce checkout fields to appear in emails…

      Please take a look at Rafael's comment. In it he shares code that should be exactly what you're looking for. Let me know if that helps.


  22. Hi

    I'm looking for a way to change checkout fields depending on which
    payment gateway you choose.

    The store has 2 different payment options. Credit card and Invoice. When choosing invoice I would like to have the alternative shipping address to be greyed out as the shipping address need to be the same as invoice address for sake of fraud prevention. How do I solve this?


    • Hi Henrik – You raise a great question regarding changing WooCommerce checkout fields based on payment gateway. Off the top of my head I'm not sure how to do that but chances are good one of our readers does. I'll go ahead and publish this comments and ask anyone that might know how to do this to chime in with the solution.



  23. Hi thank you for this great tutorial, it has helped me out so much. I just had one quick question. Instead of creating a completely new field, how would I add new field to an existing field such as the billing address section. And is there a way to change the title of the fields, such as "Billing Address" to something else?



    • I am wondering the same thing. I want to change the title for the entire "Shipping Address" section to "Delivery Address" because we do not offer shipping, but we do deliver. Is this possible?

      • Great question Connie. I will play around with the WooCommerce checkout page later today and see if I can figure out how to change the "Billing Address" and "Shipping Address" labels.

        In the meantime, if someone else knows how to do this please share it with us.



  24. Hi
    You referred me here from Youtube.
    I am trying to change the text on the checkout fields for the billing address which i have set to be the same as the shipping address. i want the billing address label to be "Your Physical Address" and the billing address placeholder to be " Enter Your Physical Address for Delivery"

    My code is
    // Hook in
    add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );

    // Our hooked in function – $fields is passed via the filter!
    function custom_override_checkout_fields( $fields ) {
    $fields['billing']['billing_address_1']['placeholder'] = 'Your Physical Address';
    $fields['billing']['billing_address_1']['label'] = 'Enter Your Physical Address for Delivery';
    return $fields;

    • Hi Cynthia,

      Try the CSS below…

      // Hook in
      add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );

      // Our hooked in function – $fields is passed via the filter!
      function custom_override_checkout_fields( $fields ) {
      $fields['billing']['billing_address_1']['placeholder'] = 'Enter Your Physical Address for Delivery';
      $fields['billing']['billing_address_1']['label'] = 'Your Physical Address';
      return $fields;

      Please let me know if that works for you. Thanks,


  25. Hello,

    Mainly searching for how to add fields that have already been created with the Custom Extra Field woocommerce plugin, or even the above and wanting to edit the way my custom fields look and fit into my invoices etc.. the above didn't achieve that for me, rather it just listed above the default fields which didn't look very nice. Instead within your desired email you are wanting to edit. In my case: The New Order Email

    I done the following: open up: admin-new-order.php "Or the one your editing"

    Then add your custom field wherever you want it. The code looks like this:

    <?php if ( $order->order_custom_fields['mobile'] ) : ?>
    <p><strong><?php _e( 'Mobile:', 'woocommerce' ); ?></strong> <?php echo $order->order_custom_fields['mobile'][0]; ?></p>
    <?php endif; ?>

    Replace the first and third word 'mobile' with the name of your field 'my_field_name' and then the second word 'Mobile:' you can change to whatever you want: 'I like my new field:'

    I hope that helps someone 🙂 It'll also not display fields the customer hasn't entered which is cool. No blank fields saying Fax: and nothing next to it.


  26. Nice tutorial, left you also positive feedback on video too. One thing that I have problem with is seeing the custom info in my "orders" . So I am able to add fields just fine but when customer orders the product I do not get those fields displayed in admin console. Am sure I need to add some type of code for admin too, but am not sure where?

    Any help would be appreciated! Also you might want to add "buy me beer button on here" 🙂

    • Hey Joe – thanks for the positive feedback on our tutorial video. It sounds like you've been able to create a custom field on the WooCommerce checkout page but have not been able to map it so that it shows in the admin. Please review the, "Adding Custom Fields to the WooCommerce Checkout Page" section of this tutorial which will show you the additional steps you need to take to get the custom field to show up in the admin. Please watch the video and use the code associated with that section and you should be good to go. Thanks,


      • Hi
        I got through your part 3 Adding Custom Fields to the WooCommerce Checkout Page video tutorial but don't find code which will show custom fields on admin dashboard. Please help me i am also want to implement this.

        • Hi Santosh – Please see the section of our Customizing the WooCommerce Checkout Page that's titled, "Adding Custom Fields to the WooCommerce Checkout Page". In that section you'll find the code you're looking for.

  27. I've been watching all your WooCommerce tutorials – thank you! You said there to ask questions here so I hope it's ok.

    I've spent a week adding products and now I've run into a problem that I can't figure out how to solve. I'm hoping you may know the solution. I've tried everything I've found in forums and nothing has worked. I'm not a web developer but have learned to design my own website (so don't understand everything and don't dare to touch things I don't know about).

    Here's the error and what I've done so far:
    I am getting this error on all woocommerce cart and checkout pages when I tried to develop them.

    Fatal error: Call to a member function is_visible() on a non-object in /home/nextgen/public_html/wp-content/plugins/woocommerce/templates/content-product.php on line 25

    Have tried uninstalling woo and re-installing. Rebuilt my permalinks. Uninstalled all plugins. I use Headway Theme. The cart showed up in 2012 them but the store did not (it's the opposite in Headway theme). After I re-installed WooCommerce, I now get the same error on my shop page and it wasn't there before. Although it loads correctly with the shop.

    I really need to get this done ASAP. Thanks for your time and help!

    • Hi Lisa,

      The issue you're describing with the WooCommerce Cart and Checkout pages is definitely unusual. I've not yet come across the error that you're getting. My suggestion would have been to deactivate the plugin > delete the plugin > reinstall it and recreate the WooCommerce pages. However, it sounds like you've already tried that and it didn't work.

      If anyone out there has run into the same or similar issue and knows of a possible solution, please feel free to share it with us here.



  28. Hi Adam-
    This was immensely helpful in learning the RIGHT way to edit your site without risking damage in the future with updates. I have a related question about editing the CART page:

    My client offers either FedEx shipping or Local pickup and on the cart page there is a link that says 'Calculate Shipping' and drops down for the customer to enter their city state and zip which will then return an estimate for FedEx.

    The problem is that my client thinks this is totally unnecessary for the people who want to choose Local Pickup and he wants the wording changed from "Calculate Shipping' to something more like 'Enter Your Location to See Your Shipping and PickUp Options'.

    Would adding code to the new functions.php file I added to my child theme folder also be the place to edit this? How do I find the code to change that?

    Also, my client wants shipping explanations to show at the top of the Checkout page… is there a way to simply add some text to the top of the Checkout page to further instruct the customer before they enter their billing and shipping info? Do I have to do that with new code in the functions.php file or can I add the text to the actual PAGE in the backend of WordPress?

    I would be forever grateful if I could find some answers to these questions that have had me stumped for weeks now.

    • Hi Jennifer – First of all – I very much appreciate the super positive feedback on our WooCommerce tutorials! I'm fairly confident that I can provide a solution for changing the wording on the WooCommerce Cart page as well as adding text to the top of the WooCommerce Checkout page. What theme are you using? Let me know so I can Firebug it…



      • Hi Adam,
        I'm using the Wootique theme that I customized myself, I figured yesterday after playing around out that you can add text to the top of both the CART and CHECKOUT pages just by editing the actual pages that WooCommerce creates in WordPress itself. Doesn't seem to be causing any problems that I can see so far.

        Here are the pages you can see that I added text at the top of each one in an attempt to 'steer' the customer and help them to not be confused:

        The reason I had to add so much info to explain is because the checkout page was not showing any shipping options when you first arrived there, and my client freaked out thinking that a customer might be able to go all the way through an order without paying for shipping. (Although I was assured by WooCommerce support that that would not happen unless it was a downloadable product that didn't require shipping).

        So… for a while I wasted time trying to skip the Cart page altogether, and just direct people straight to the Checkout page (that didn't really work out well, got some code from WC support that didn't work for me).

        But now, I think just adding the descriptive text at the top might work out fine, but I still would like to change the 'Calculate Shipping' to something more appropriate for my situation.

        • Thanks for sharing that Jennifer! It's good to know that you can add more descriptive text to any of the WooCommerce Pages by simply editing the page itself. Thanks again for sharing your knowledge with the community. I'm sure it will be helpful to many people.


  29. Hello Adam,

    I've watched all these tutorials, thanks for making them. I'm making my first WordPress site with WooCommerce, and I'm wondering it's possible to make the shipping calculator in the cart a required field. I tried using the functions you suggested for the checkout page, but it doesn't seem to work with the shipping calculator. For this site I want people to be able to see the shipping cost before they advance to the checkout page, and if they don't select a state with the shipping calculator, the shipping cost reads "0" on the checkout page. Thanks for your help!


    • Hi Brad,

      That's a good question… I've not yet played around with the WooCommerce Cart page enough to know for sure how to make the shipping calculator a required. What's strange is that the shipping cost on the cart page is displaying as 0 when a state is not selected. I'm going to publish this comment and ask for help from other WooCommerce users on this one. I'll spend some time later today looking into it further and update this comment if/when I find a solution.



  30. I'm new to wordpress and working on developing my skills. My first ecommerce site is almost complete (that would be site #2 for me).

    My client threw me a curve ball!

    I need to add a Tax ID# field to my woocommerce checkout that will also eliminate the tax if there is an ID# in the box.

    I have a basic understanding of functions, hooks etc, but of course don't want to "break it"

    Is there anyone that would be willing to walk me through this? I want to learn, not just be given the info.

    Appreciate any help!

    • Hi Laurie,

      That is a curve ball for sure! So it sounds like you need to add a custom field (Tax ID#) and I'm assuming that will not be a required field. Then, if a tax id is entered into the field it would override / eliminate sales tax on the products in the cart. Is that a correct interpretation?

      If so, I'd have to spend more time looking into how to make that work because I'm honestly not sure off the top of my head. I'm going to go ahead and publish your question and ask the Upload WP community to chime in with possible solutions to this.



      • thank you! I certainly appreciate the help! right now, I'm implementing the custom field that will not be required. From this amazing tutorial, I feel I can make that happen!

      • I've been able to create a custom field for the tax ID#, make it not required. Now I'm stuck.

        Here's what I'm thinking this needs to do:

        If there is a Tax ID# in the field == tax is recalculated to be none & the cart updated.

        I found some other info on this, but it's not quite right I get an error and not sure why. So much to learn!

        add_action( 'woocommerce_checkout_update_order_review', array(&$this, 'taxexempt_checkout_update_order_review' ));
        function taxexempt_checkout_update_order_review( $post_data ) {
        global $woocommerce;



        if ( isset($tax_exempt_checkbox) && isset($tax_exempt_id) && $tax_exempt_checkbox == '1' && !empty($tax_exempt_id))

        The sample used a check box, name and field. I removed the checkbox & name, but it still didn't work. Help?

        Also found this:
        } add_action( 'woocommerce_calculate_totals', 'remove_tax_for_exempt' );
        function remove_tax_for_exempt( $cart ) {
        global $current_user;
        $ok_taxexp = get_the_author_meta( 'granted_taxexempt', $current_user->ID );
        if ($ok_taxexp){ // now 0 the tax if user is tax exempt
        return $cart;

        which looked like it would work, but for some reason my order information disappeared and I couldn't process the order.

        HELP Please! Hate not having a solution for my client and leaving him hanging while I scramble. Thank you!

        • Hi Laurie,

          I completely understand your frustration and wish I had a good answer for you. I'm just honestly not sure on this one. Have you looked into possible using an extension for woocommerce? There might be one that adds this type of functionality.

          If anyone out there can chime in and help Laurie find a solution to this it would be greatly appreciated.

  31. After I make the child theme and functions.php file the changes are made on the site but when I update the functions. php it goes blank and I have to select back. When I close and reopen my browser to the checkout page, I receive the same error (the screen is blank white). Do you have any suggestions to why this occurs?


    • Hi Rafael,

      Most likely there is something wrong / incorrect with the code that you're pasting into the functions.php of the child theme. Please let me know / show me the code you're using and I'll do my best to trouble shoot it.



      • Hi teddy, happy new year and thanks for the child theme tutorial, this made my week brighter lol

        I do have a white page too when i add this code:

        the function in question is "is_purchasable"
        My goal is to make a membership site where the (membership product) can be bought and others cant until membership is bought and confirmed.
        Using groups, groups woocommerce, subscription woocommerce.

        Best regards

        • Hi Kad,

          Happy New Year to you as well! I'm not sure I'm following you're question. Are you making updates to functions.php in your child theme and you're getting a white screen when using the php in the link you provided? Please use our Community Forums to post your question and please provide as much detail as possible. That will make it easier for me and other Upload WP community members to help you. Here's the link to our forums…

  32. Do you have any video tuts on how to customize the woocommerce checkout layout? For example, I want to change the layout of the form and if possible split pages up (having billing and CC on first page, charge card, then get shipping info from customer).


    • Hi Riley – We do not yet have tutorials on customizing the layout of the WooCommerce checkout page, just the fields. I'll add that to our list of tutorials to work on though. If anyone out there can point Riley in the right direction it would be greatly appreciated.

  33. Hello, nice article and I'm sure I will need to read it a couple times.

    On my site, I'm trying to see if I can implement a way to ask the users if they want to subscribe to our newsletter on the checkout page.

    Is it feasible to add a yes/no option for this and then automatically add them to a MailChimp newsletter list?

    Thank you.

  34. Hi there,
    thank you for your great post. Could you please tell me how to set a drop down field on the WooCommerce checkout page? I have looked everywhere but I cannot find any solutions.

    • Hi Giovanni,

      Thanks a great question on adding a drop-down field to the WooCommerce checkout page. I'd have to spend some time looking into the code to figure that out. I will update this post when I have the solution.



  35. Thanks for the instructions on customizing the checkout page. I have one problem though. After configuring the child page, and installing the fields that I need, the PLACE ORDER button has somehow lost it's link to complete the order. Instead it just sits there when pressed. How do I restore the link so it will complete the checkout process and send the client to the thank you page.

    • Hi Burton,

      Is this happening when the customer pays via Credit Card with Mijireh Checkout? Or is it also happening when PayPal and Cash on Delivery are used? I just tested it with Credit Cart (Mijireh checkout) and it took me to the payment page. I did not complete the order but it looked like it would work. Please provide more detail as to with what payment method this issue is happening and I'll do my best to help.

      p.s. I love your site and you're products!

  36. Hi Adam,

    Really have enjoyed your videos. Have learned alot over the months.

    As my site is still in the developing stages, I'll be selling sheet music via a PDF file and also CD's of my music. One digital and one physical product.

    How can I set up my checkout page that whenever I have a customer buying a digital product, the only thing that is required is their name and email address.

    And when they purchase a physical and or a digital product, then the default checkout page in WooCommerce appears, requiring their full address.

    Won't be necessary to collect their address with a digital product. But with a physical product, yes.

    So I am not sure the best way to set this up. Just to use the tutorial here in part 4 of this series to make just the name and email mandatory? Or create another new checkout page that would be triggered by a digital product?

    Many Thanks,

    • Hi Cory,

      To start, my recommendation would be to keep it simple and just make the Name and email fields mandatory. If a person purchases a CD but does not enter their shipping info you'll have their email and can contact them to get it. My guess is that in most cases that won't be an issue. Thanks for your question and for letting us know that our WooCommerce tutorials have been helpful. Best of luck with your site, and let me know when more questions come up.


  37. Hi Adam,

    To remove the Phone and Company, both those worked fine. I tried to remove the Zip below and did not have any luck. Not sure why that did not work for me. Also, tried city and address. Puzzled about this. Using Dynamik-Builder for Genesis and is in the Customs Functions. Have not taken a look yet at the shipping.

    add_filter( 'woocommerce_billing_fields', 'wc_npr_filter_phone', 10, 1 );

    function wc_npr_filter_phone( $address_fields ) {
    $address_fields['billing_phone']['required'] = false;
    return $address_fields;

    add_filter( 'woocommerce_billing_fields', 'wc_npr_filter_zip', 10, 1 );

    function wc_npr_filter_zip( $address_fields ) {
    $address_fields['billing_zip']['required'] = false;
    return $address_fields;

    Thanks Again,

  38. Hi,
    Is it possible to add my custom field onto "Order Received" page(the page just after you click "place order" on the checkout page)? I managed to add a custom field into checkout and email from your tutorial, which is brilliant. I just want to make it even better. Cheers.

    • Hi Alex,

      I'm glad to hear that our tutorials helped you add custom fields to the checkout page of your WordPress site. I'm not sure on adding custom fields to the WooCommerce Order Received page. I'll have to play around with that and see if I can figure it out. In the meantime, I'll go ahead and publish this comment and ask the community help with this.



    • Hi Jennifer – So the custom fields that you created for the checkout page are not mapping to the back end after the order has been place? Or, are you referring to the placeholder text that shows up in the custom fields on the checkout page? Also, please send me the link to your site so I can trouble shoot it.



    • Hi Ed,

      Please take a few minutes to review our latest tutorial on "Overriding WooCommerce Template Files via a Child Theme". That tutorial should point you in the right direction in terms of changing the wording for Download File on the My Account and Thank You pages. I believe the two files you'll have to modify are…




  39. I figured it out that I didn't name and map fields accordingly, but thank you anyways! Your tut. is great.

    But lastly…is there a way to make these custom fields actually go INTO the user field in the dash board? For example, in the users page you can see the basic info plus all the stuff they entered at checkout (my custom checkout fields)??

    • Hey Jennifer – I'm glad to hear that you got it figured out and thanks for sharing the solution. Most likely, there are other people that are struggling with the same thing but now have the solution thanks to you. I'm not sure in regards to your question on making the custom fields go into the user profile in the WordPress admin. I'd have to do some testing before I can say it is, or it is not possible.

      If anyone out there knows the answer to Jennifer's question please share it with us.



  40. Slipped my mind — how can we add a custom picklist/drop down field on checkout? And is there a way to make it remember the contents of the custom field so on each subsequent checkout, they don't have to fill out all those details again?

    • Hi Jennifer – Adding a drop-down and/or radio buttons to the WooCommerce checkout page is something I've not yet figured out how to do. I'm going to play around with it today and if / when I figure it out I will post it here.

      If anyone else out there knows how to add custom drop-down fields to the WooCommerce checkout page please let us know. Thanks

      • Theres a free WP plugin called Woo Radio Buttons

        I'm trying to find out how to display different content once you click a radio button on the product page.

        Any help would be appreciated!

  41. Awesome tutorials, Adam! I want to add the field "Add shipping insurance" to the checkout and have a numeric value added to the grand total. The field should consist of either radio buttons or a drop-down. Do you have a script that could make this happen? I'm new to WooCommerce so still learning how it all works. Really appreciate your help, thanks!


  42. Hi Adam,

    I love the videos lots of details to help folks get started. Also great work answering questions about WOOCOMMERCE.

    My questions is this:
    I created a custom field. The field is added using function php and shows up on all checkout pages. I only want it to show up on when ONE particular product is chosen. I would need to read through the cart for this product, that it is added. Then check can ensure that this field displays it to capture additional information.

    Example: SWIM CAP – personalization. I would need a name to capture.
    Purchase or add cap to cart. Then this cap needs the name. But if the user adds another product we do not want to show the custom field we added (force added) using function php. How can I hide it? Do you know which template I can use and where or what code I can place into the mix to hide this custom field?

    Thanks for all the help.

    Using WP – 3.6
    WOOCOMMERCE – 2.0 .13

    Custom Child theme – publish is parent.

  43. Hi,

    Thanks a lot for this tutorial wich makes me gain skills, time and money !
    I added many custom field and all appears to be ok !

    But tought i have a 'select' type field with 4 options and i want to force the customer to select one, with none selected by default, in order to check if they filled it.
    My verification doesn't work if the first option is the default selection because it's always filled.

    Do you know how to define a blank default state in a custom select field ?

    • Hi Youl,

      Thanks for your question and I'm glad to hear that our WordPress tutorials have helped. That's a great question in regards to defining a blank default state in a custom field on the WooCommerce checkout page. I'll have to do some testing to figure that out and I'll ask for help on this one from the Upload WP community. Please chime in if anyone knows how to define a blank default option when creating a custom field.



  44. Great tutorial. I installed your example and it worked perfectly. Thank you.

    Would you know the correct syntax to get a pulldown menu to appear instead of a text box?

    I have been using this pulldown menu in older versions of WooCommerce, but can not get it to work with 2.0.

    <p>How did you hear of us?</p>
    <select name="order_comments">
    <option value="Option1">Please Select</option>
    <option value="this is the first selection</option>
    <option value="SelectedOption1">This is selected option 1</option>
    <option value="SelectedOption2">This is selected option 2</option>
    <option value="SelectedOption3">This is selected option 3</option>
    <option value="SelectedOption4">This is selected option 4</option>
    <option value="Google">Google</option>
    <option value="Other">Other</option>

    Any suggestions would be greatly appreciated.

    • Hi Steve – Thanks for letting us know that the PHP for customizing the WooCommerce checkout worked for you. I'm honestly not sure how to get the pull down menu to work with WooCommerce 2.0. I'm going to go ahead and ask for help on this one from the community. I'll play around with it and see if I can get it to work.

  45. great tutorial, wondering if anyone can help me with this;

    I want to put a couple of validation checks on the checkout page and wasn't sure where they go exactly (ie. functions.php or class-wp-checkout.php)

    1. checking time on server eg; (psuedo)

    if $time == outside_operating_hours
    alert("sorry we are closed …")

    2. checking to see if the zipcode is within a range eg: (psuedo)

    if $postcode != deliverable_postcodes
    alert("sorry we do not deliver to your postcode pls try again…")

    • Hi Peter – Thanks for your question on putting validation checks on the WooCommerce checkout page. Off the top of my head I don't have a good answer for this one so I'm going to publish your comment and ask for help from the Upload WP community.

      If anyone out there can answer Peter's question on adding validation checks please chime in. Thanks

  46. Great Tutorial!

    Please i need help on this.
    I have a problem with my woocommerece shopping cart. It does not update/empty after a successful payment or confirmed order. Payment processor redirects to Order confirmed page but the shopping cart still remains intact with all the products. I have two payment processors with plugins and its the same story when order is placed with the two.

    any ideas on how to resolve this?

    • Hi Temi,

      Thanks for the positive feedback and for your question. It's possible that the issue is caused by a plugin. From what I can tell, it looks like you're using a number of social media plugins. Try disabling all of your plugins (except woocommerce) and then run a test order. If that fixes the issue, then activate the plugins one by one until you find the offending plugin. Start there, if that does not work let me know and we'll try something else.

  47. Hi Adam!
    I want to be able to add a complete 'medical form' just above the 'Your order' section on the Checkout page. Is that possible? How do I change the position of the new fields from the top right side of the Checkout page to where I want. The customer has to fill the medical form before proceeding with the order.

    • Hi Rosiee007 – Given that you need to add an entire medical form to the WooCommerce checkout page, your best option is probably to use an extension / plugin. Specifically, the "Checkout Field Editor" plugin is what I have in mind. With the Checkout Field Editor extension you should be able to easily add the medical form to the checkout page.

  48. Hi thanks for the awesome tutorial you provided for us, this is the best one! i swear!

    I have an issue that needed your help with.

    I used the filter 'woocommerce_checkout_fields' to remove fields on my checkout page, I remove the following fields:


    yes it successfully remove the fields on my checkout page, the problem is when I click submit the fields I remove is still required! is there a hook to change required to not required on account fields? I see your tutorial for this but it covers shipping./billing fields, I also check woocommerce hooks reference and cannot see any hook to modify an account fields.

    Cheers! and thanks in advance

    • Hi Alf – Your support and feedback is very much appreciated! I'm honestly not sure so I'm going to go ahead and publish your question and ask for the community to help. Most likely there is someone out there that knows the answer and will share it with us here. Thanks

  49. Hi
    On checkout – how do I remove the default link

    ' returning customer ' click here to login here'

    as this is confusing some NEW users –
    I rather NOT have it on the page and allow them to login with the login button at the top of the page

  50. Hi great customise tutorials, I want to change back to shop button when the cart is empty and redirect to another page. This is the code I want to change but not sure how to as I mainly work with HTML.

    <p><a class="button" href="<?php echo get_permalink(woocommerce_get_page_id('shop')); ?>"><?php.

    Any advice?
    thanks Dyer

    • Hi Dyer,

      Thanks for your question. Please let me know the URL to your site and the page that you want the "Back to Shop" button to redirect to when the Cart is empty. I'll do my best to get you the info you need and I'll also ask the Upload WP community to chime in with their suggestions.


  51. thanks for the great tutorial!
    I've downloaded and installed wootique child theme – thanks you for that also- and am trying to make changes to my checkout page.

    /* All child theme functions go here

    ———————————————– */
    // Rename 'Republic of Ireland' to 'Ireland'

    add_filter( 'woocommerce_countries', 'rename_ireland' );

    function rename_ireland( $countries ) {
    $countries['IE'] = 'Ireland';
    return $countries;
    function add_my_country( $country ) {
    $country["NI"] = 'Northern Ireland';
    return $country;
    add_filter( 'woocommerce_countries', 'add_my_country', 10, 1 );
    // Hook in
    add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );

    // Our hooked in function – $fields is passed via the filter!
    function custom_override_checkout_fields( $fields ) {
    $fields['order']['order_comments']['placeholder'] = 'Any special requests?';
    return $fields;
    Everything works fine untill line 25 where I try to clear billing_address2 and nothing works after that.
    The top part of the code would be of use to anyone trying to change the countries list in woocommerce. That part works!
    I'm pretty sure I have followed your excellent tutorial correctly but just can't figure out what I'm doing wrong. Any help would be most greatfully received.
    Dave murphy

    • Hey Dave – Thank you very much for the positive feedback. I'm glad to hear that our WooCommerce tutorials have helped and that you're using our Wootique child theme. From what I can tell looking at your code everything looks correct.

      I'm going to ask for help from the Upload WP community on this one. If anyone out there can look at what Dave has shared and help him it would be greatly appreciate.

      • After a lot of work I arrived at a compromise by deleting the State and the Zip code fields completely and adding a new post code field for Northern Ireland only. This still left 3 lines for address which is sufficient here. I used the woocommerce checkout manager plugin and also added woocommerce email validation plugin as woocommerce checkout page does not have validation. See
        The only thing I can't do is to remove the placeholder text in address2 field which just sound weird to Irish ears. Here a suite refers to furniture!
        Thanks again for the great tutorial

        • Hi Dave,

          Nice work on your site, You've done a great job customizing the checkout. I want to make sure that I'm following you're question… The placeholder text that you're looking to remove is… "Apartment, suite, unit etc. (optional)"

          Is that correct? Let me know and I'll do my best to get you a solution.

          • That's it. It's to do with slight differences in language. Irish addresses would always start with Apt no if appropriate in the first line not the second line and to Irish ears a 'suite' is a sofa(couch) and 2 armchairs, Something to sit on rather than part of an address!
            Thanks again for your help.

          • No need for apology. I am retired programmer and mcse, I select the canvas theme to have to learn. It seems that every time I have a problem I realize what was wrong after I put in writing. I realized where the terms & conditions were pointing to after my first request.

            Thanks for the fast reply.

            Have a blessed day….

  52. Hello! I have seen your tutorials and they are vary useful! Thanks to you I have made a lot of minor changes for now. However, I have a problem. How can I change the menu button when I am using the mobile version? You see the red button is not understandable as menu by most. So, I want to write in there "Menu". How can I do that? Thank you!

  53. hi teddy, great blog, i have my woocommerce ready and im searching some method to allow me add +3% value for my credit card buyers, in way that would increase the price of my default value but i need to assign that in my checkout process, when the user select to pay by CC (after to select the payment method).

    can you help me with these?

    • Hi Juanma – Thanks for the complements on our site. Have you looked into using an extension for WooCommerce? An extension is most likely your best bet to increase price for credit card customers. If you do a Google search for "WooCommerce Extensions" you'll find the full list.

  54. Hi,

    This is awesome tutorial. I learned a lot from this. I am providing service which is completely online, so I removed complete billing address fields from checkout page. However there appears some text which I am not able to remove. The text is

    "Additional information"

    Create an account by entering the information below. If you are a returning customer please login at the top of the page."

    While additional information appears as heading, the rest appears like paragraph.
    Below this line is the box for Password and Confirm password.

    I want to remove the text. Is there a way to do it? I was able to remove the paragraph text but not the heading text (Additional information)

    Any help is appreciated. Thank you.

    • Three additional follow-up questions:
      1) Is the new custom field required by default?

      2) Is the location of the new field dependent on the "woocommerce_after_order_notes" add_action? If so, can that be altered to place the new field elsewhere?

      3) Is the new custom field included in the order email/admin email?

  55. This has been amazingly helpful, thanks!!

    I'm struggling with one last cosmetic detail – which is the placement of the custom fields on the page. While after the order notes is fine… I want my custom fields to be page width (keeping the billing and shipping columns in the columns above). I've tried all kinds of things (i.e., ending the div tag, guessing at "woocommerce_before_order_heading") but I'm not getting anywhere.

    Suggestion would be very welcome and appreciated!

    • Hi Glenda,

      Thanks for letting me know this tutorial on customizing the WooCommerce checkout page has been helpful. I'm going to publish your question and ask for help from the Upload WP community on this one…

      If anyone out there can help Glenda with this please chime in. You're help is greatly appreciated.

  56. After I did this edit of line six

    // Hook in
    add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );

    // Our hooked in function – $fields is passed via the filter!
    function custom_override_checkout_fields( $fields ) {
    $fields['order']['order_comments']['placeholder'] = 'customized here';
    $fields['order']['order_comments']['label'] = 'customized here';
    return $fields;
    Parse error: syntax error, unexpected T_STRING in /home1/mmm/public_html/wp-content/themes/theme-child/functions.php on line 6
    I would highly appreciated if there is anything I could do fix it. I basically went back to my file manager and edited the functions.php file to strictly <? php ?>
    Then I was back online.


  57. Is the location of the new field dependent on the "woocommerce_after_order_notes" add_action? If so, can that be altered to place the new field elsewhere? Like say after the billing email field?

    Note: I've broken apart my group of questions, from above, into an individual question.

  58. Can anyone shed any light as to why the check boxes borked when I upload a child theme? CSS is identical to parent theme and child functions.php looks like this:

    /* All child theme functions go here
    ———————————————– */

    // Hook in
    add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );

    // Our hooked in function – $fields is passed via the filter!
    function custom_override_checkout_fields( $fields ) {
    $fields['billing']['billing_address_1']['placeholder'] = 'House name or number';
    $fields['billing']['billing_address_2']['placeholder'] = 'Street address';
    $fields['billing']['billing_postcode']['placeholder'] = 'Postcode';
    $fields['billing']['billing_state']['placeholder'] = 'County';
    $fields['shipping']['shipping_address_1']['placeholder'] = 'House name or number';
    $fields['shipping']['shipping_address_2']['placeholder'] = 'Street address';
    $fields['shipping']['shipping_postcode']['placeholder'] = 'Postcode';
    $fields['shipping']['shipping_state']['placeholder'] = 'County';
    return $fields;


    Thanks in advance,


  59. Hi There,

    I have a massive spreadsheet with postal codes and towns within South Africa that we can deliver our gifts to. We cannot deliver throughout South Africa as some towns are to far away. I somehow need to have this implemented within the checkout, so that customers can select only specified postal codes.

    Do you have any advise on how best I can do this?


    P.S it;s about +/- 4500 postal codes and towns..within South Africa.

    • Hi Craig,

      You're best bet is the use of a shipping extension / plugin for WooCommerce. The one shipping extension that stands out is, "Table Rate Shipping". There are other shipping extensions as well so I would start by looking through all of them. Just do a google search for "woocommerce shipping extensions" and you'll find the full list.

  60. Hello there,

    Just wondering if you could help me with my cart page please. When I click on the icon in the top menu (customer navigation) nothing happens – the page does not load. Ive been going over this for a few hours now and cant find a solution anywhere.
    Thanks in advance 🙂
    Kind regards

  61. As an eCommerce / online store owner, the best way to communicate (in most cases) with you're customers is via email. So, what happens when they input an incorrect email address on the WooCommerce Checkout page?

    A common way alleviate this problem is to force customers to confirm their email address on the checkout page. If you have ever signed up for an account with a website, you have no doubt been asked to enter your email twice. This is an important fail safe to ensure you have the proper data for your customers.

    To add an email validation field to your WooCommerce site simply download, install and activate the WooCommerce Email Validation extension. That's it! The plugin works seamlessly and adds an email confirmation field to the check out page. Never worry about customers accidentally entering the wrong email address again.

    Watch Adam Barndt demonstrate how to add an email validation check to the checkout page in his "WooCommerce email Confirmation Extension Tutorial"…

  62. Hi there! Thnx for this wonderfull tutorial, it has helped me alot with figuring out how the checkout page is configured!

    I still have one question though:

    I want to add a custom field just like the one in your tutorial but only on a different place, like after Company name for example.

    How can i do this?

    I would be very very pleased if you could help me out on this one ! 🙂

  63. Awesome Videos and Tutorials!

    Im trying to add a 'Agree to terms and conditions' checkbox to the checkout page, and I would like to make this a required field, that users must check before they can checkout.

    Any suggestions? I feel like a lot of websites could benefit from this !?!?

    Thanks in advance

    • Hi Mitch,

      Here's how to add an "Agree to Terms and Conditions" page and check box in WooCommerce…

      Step 1. Create a new page called "Terms"… In the WP admin go to Pages > Add New > title it "Terms" > add your content in the body of the page > Publish page

      Step 2. Set the Terms Page ID… In the WP admin go to WooCommerce > Settings > click the "Pages" tab > under Page Setup you'll see "Terms Page ID" and a drop-down next to it > select the Terms page you created > Save changes

      That's it… go to the WooCommerce Checkout page and you'll see the Terms and Conditions check-box appear.

      If you go to our woocomm demo site, you'll see the terms and condition box appear on the checkout page.

  64. Hi Teddy,

    Thanks for the great tutorials! I have three questions regarding Mystile I was hoping you could help with:

    1) How can I increase the ammount of products shown in each row on my homepage and shop page from 4 to 5?
    2) How can I relocate the "I agree to the terms…" check box on the checkout page so that it is on top of the submit button?
    3) How can I change the checkbox styling as shown in google chrome? I think it is very unintuitive and would prefer a normal looking checkbox.

    Many thanks in advance!


    • Hi Travis,

      Thanks for your support and positive feedback on our WordPress and WooCommerce tutorials! The good news is that I have an answer for 1 of your questions. I'm still working on solutions to the other two and will update this comment when I have them.

      I made a tutorial video that shows you how to "Display 5 Products in a Row on the WooCommerce Shop Page for the Mystile Theme". Here's the link to watch that tutorial video…

      Make sure you have your Mystile Child Theme active and in the WordPress admin go to Appearance > Editor > in your Stylesheet (style.css) paste the custom CSS below…

      @media only screen and (min-width: 768px) {
      ul.products li.product {
      width: 16.05%!important;

      Next, click on Theme Functions (functions.php) and paste the following PHP…

      remove_action( 'woocommerce_before_shop_loop', 'woocommerce_catalog_ordering', 30 );
      add_filter('loop_shop_columns', 'loop_columns');if (!function_exists('loop_columns')) { function loop_columns() { return 5; }}
      if ( empty( $woocommerce_loop['columns'] ) ) { $woocommerce_loop['columns'] = apply_filters( 'loop_shop_columns', 4 );}

      Do to some formatting issues with publishing PHP in comments, you're probably better off copy/pasting it from there into your functions.php from here…

      Please note, you can get a Mystile Child theme by subscribing to our Newsletter.

      • Hi,
        Sorry about the earlier comment, I figured out my problem.
        By following your instructions I am able to get 5 products in a row on Shop page of woocommerce,

        As I have my 'Product Categories' also displayed in my Shop page, I misunderstood that by following your instructions I will be able to get 5 Categories in a row …. which did not happened! though I have now space enough for the 5th category.

        Please let me know if there is a way where I can get 5 categories in a row also in my Shop page.

        Best regards

      • Dude, you are a lifesaver, thank you so much. i followed your tutorial for showing 5 products in a row, but unfortunately i have run into a problem, on shop page products are being shown as promised by your tutorial, but on the product page, the "related products" pictures are zoomed in gigantic size. please help me out here.

  65. How do you figure out what the field names are?

    for example, for modifying the "shipping company", you said to input the following:

    add_filter( 'woocommerce_shipping_fields', 'wc_npr_filter_company', 10, 1 );
    function wc_npr_filter_company( $address_fields ) {
    $address_fields['shipping_company']['required'] = true;
    return $address_fields;

    what if I want to make a different field "required", and this field is from another plugin? I want to make the purchase order field required, and this is a field from another plugin called "woocommerce purchase order". How do you figure out what the field_names and $functions are?

  66. Hi guys! Thanks for the amazing tutorial, it was exactly what I needed! I wanted to also suggest that you create a follow-up tutorial to show us how to add these custom form field values to the WooCommerce CSV Export plugin as well.
    Thanks again!!

  67. How can I change the order of these fields?
    In China,
    the natural address order is "Country – > Province – > City "
    the natural name order is "Family Name -> Last Name"


  68. Thanks for all of your helpful videos!
    How would you go about allowing customers to enter credit card/payment information but not have the processing go through? We're looking to create more a catalog/order system but want to be able to approve processing the orders ourselves– this is for wholesale so we want buyers to easily place order requests but not actually process the payments until we review them.
    Also, is there a way to create a box under each product to type in the quantity desired?

  69. Hi,

    I'm hoping you can help. I've been searching for days and simply can't believe what I need isn't available. I asked a tech that helps us and she also said it doesn't seem to be out there. I simply want to have the ability to add an optional insurance radio button or check box on the checkout page with a set amount to choose if they want insurance. The amount would always be the same, lets say $2.95 for example. If they choose "Yes" to accept it, it would simply add to the shipping charges and the total would be listed for the entire order below. I can't believe I'm the first person to need this??? Would greatly appreciate any guidance you can offer.


    • Hi Barry – Thanks for your question on a plugin / extension to add a shipping insurance check box option to the WooCommerce checkout page. Basically, it would be a check-box that gives customers the option to add shipping insurance > when they click the box the shipping insurance cost is automatically added to the shipping cost and life is good. I've spent about 20 minutes searching for an extension that adds that functionality and have not yet found anything. I can't believe that either! It seems like a no brainier that someone would have created a plugin to add that functionality but I've not yet found it.

      If anyone in the Upload WP community knows of an extension for Woocommerce that allows site owners to add an option "shipping insurance" check-box to the WooCommerce Checkout page please share it with us. You'll be helping many people that are looking for a solution to this. Thanks

  70. Hi,

    I want to insert a QuForm under the notes and i want it appear on the admin.
    The goal is quiet simple, my website is a drive and i've to insert a calendar with time in order to take off the order on the shop.

    Do you have an idea, the way i'll have to make it possible ?

    Great thanks to you,

    Teddy to Teddy 😉

  71. Hello, thank you for this great tutorial. I was able to rename my placeholders and remove fields on the checkout page, but how do i do the same for fields on the 'edit address' page. Please help.

  72. Thank you for such a good post. Could you please guide us how to change PLACE ORDER button with PayPal button. I am looking to replace PLACE ORDER button with PayPal button image so I have to add paypal button url.
    Also I would like to add a heading above email field.
    Any idea how I can do these two changes.

  73. Hi Teddy

    Great article, quick question, I am working on an eCom Site and I want to "Paginate" the checkout page like a wizard style, first section/page displays order summary, and then when user click "Next" it requests the "User & Shipping details" and then they click next again for the "Payment Details". Is there a plugin or solution for this.



    • Hi Zafi,

      Thanks for the complements on our tutorial. I unfortunately do not know of a checkout page pagination plugin. Not saying that one doesn't exist, but I've not found one yet. Your best bet would probably be to find a theme that has it built in. There are a bunch of high quality woocommerce ready themes at ThemeForest and chances are good you'll find one that has the pagination you're looking for built in.

  74. Hi Adam,

    Many thanks for all your tips on this page and via your YouTube videos..
    It has really helped me develop my WordPress skills.. I appreciate your time and effort very much..

    I won't ask any questions as you have given me lots of information already 🙂

    Thanks again,

  75. First of all you tutorials have been very helpful. I wanted to ask if you could tell me how I can add "title" drop down i.e Mr /Miss/ Mrs before the Name on the billing and shipping address. I find it quite strange that the guys over at WC left out an essential element of identification.
    Thanks in advance for your help.

  76. Hey Adam! Your tutorials are such a big help, Thank you! Do you know how to make "Shipping Address" say "Delivery Address" and "Deliver to billing address" at that checkbox? Any advice would help! Thanks again!

  77. Hey guys,
    I have a question. The mystile theme advertises that they include three short codes that I've been looking all over for: mini features, sticky notes, and sales.
    Where are these? Has anyone had any luck with this ?
    I've tried adding the short codes to my mystile child theme and it made a mess of things- didn't work!
    Please advise!
    I am trying to get the three mini features on homepage above Recent Products.

  78. Hi Teddy,

    In my WooCommerce checkout process the order is Login, Billing Address, Payment Method, and then Order Review.

    I plan to use both credit cards and Paypal and only sell digital products. If a user wants to pay with Paypal I really don't need the billing info at all. Is there a way to change the checkout order so that Payment Method is chosen before Billing Address and Billing Address is not required if PayPal is selected?

    Thanks for the great tutorial.

  79. Hi Teddy,

    Good stuff. However I have a slightly different situation. I am not sure if this it the proper forum, but I will ask anyway as it does have to do with woocommerce checkout page.

    In our website we have two types of payments: purchase a product, and make a payment on account. We have the purchase part working just fine using the Checkout page. However, I am not sure how, or if it can be done, to hook up a payment process through the checkout page. We currently have a form page where the user enters all there info including credit card, but all it does is send out an email, and sends nothing to the Moneris payment gateway. Is there a solution using woocommerce and the checkout page or at least the payment portion? Or do have another suggestion?

    Cheers ….

  80. I saw your tutorial and I decided to download and try woocommerce. I would like to ask you if you can help me because I have a problem. In shopping check-out page, the PLACE ORDER (PLACE AN ORDER) button, button is unclickable or inactive.
    If I do not pass this problem I'll have to give up 🙁
    thanks anyway

  81. Hi,

    1. Is there any way to make the Coupon Code to be mandatory?
    2. And to keep the payment method keep displayed even the coupon is for 100@ discount?

    Thanks in advance

    • Hi Rio,

      Thanks for your question on woocommerce coupon setup. Most likely it is possible to make the coupon field required. To better help you and others that have similar questions, please go to the Upload WP Community Forums here…

      We have active members that are more than willing to help. Chances are excellent, if you join and start a new thread in the "WooCommerce Coupons" forum you'll get a quick solution. It's free and easy to join so hopefully I'll see ya there.

  82. Hi,
    Great info here! I have a few questions:

    1. How can I change the order that the billing address fields appear on my site? Right now, Country is before State, which seems atypical/unexpected from a user standpoint.
    2. When someone registers during checkout, how can I have the site return them to the cart screen instead of taking them to their dashboard?
    3. When someone has a cart total of $0 (i.e. used a coupon), how can the site either a. skip the payment info screen, or b. add text to the payment info screen instructing them to click the "Order Review" button to proceed?

    Thanks so much for any help you can give.

  83. Great post, and very well explained. However there is one issue I've had – some fields cannot be changed with this method. For example, try adding the line
    >$fields['billing']['billing_state']['label'] = 'County';
    and the label will stubbornly remain 'State/County'.

    Not to mention that the address area in the "My Account" page is unaffected by any of this.

    After some searching I found the solution; there is a filter called 'woocommerce_default_address_fields' which takes precedence over the 'woocommerce_checkout_fields' filter.

    I think that where possible it's better to use 'woocommerce_default_address_fields' as it affects all occurrences of the field being edited. For example, the following removes the postcode field from every address area:

    [code] add_filter( 'woocommerce_default_address_fields' , 'custom_override_default_address_fields' );

    function custom_override_default_address_fields( $address_fields ) {
    $address_fields['postcode']['required'] = false;

    return $address_fields;

    The address fields that can be edited this way are:

  84. Adam,

    Do you know if it's possible to use woocommerce as a shop and set up the checkout process to circumvent payment altogether? My client isn't ready for ecommerce just yet, but would like customers to be able to order from their site. Maybe add the online ordering later.

    Can I set up the checkout process to not require payment to finish and issue a purchase order or "reserve this item" type of order instead? The customer would pay when picking up, or include a phone number for the store to call and process credit card payment over the phone.


  85. Hi Adam,

    I have a few customization's on checkout page. i was success full with few things but i am not able make the below mentioned customization's. My website is

    I need you kind help in getting these things sorted out. I have more to share but for now i need to do these changes.

    1.Change state/county label to State in billing and shipping & place holder as Select State.
    2.Change Postcode/ZIP to PIN Code in billing and shipping

    For the above i am using the code but i am not able to see the changes with these lines of code.

    $fields['billing']['billing_state']['placeholder'] = 'Select State';
    $fields['billing']['billing_state']['label'] = 'State';

    $fields['shipping']['shipping_state']['placeholder'] = 'Select State';
    $fields['shipping']['shipping_state']['label'] = 'State';

    $fields['billing']['billing_postcode']['label'] = 'PIN Code';

    $fields['shipping']['shipping_postcode']['label'] = 'PIN Code';

    I have to remove the following options on the Checkout page.

    1.Remove Returning customer option.
    2.Remove Have a Coupon option.
    3.Remove Create an Account option.
    4.Remove Direct transfer option.
    5.Remove cheque payment option.

    Currently i successfully completed removing billing/shipping company, LastName not mandatory on the checkout page and the code is below.

    // Our hooked in function – $fields is passed via the filter!
    function custom_override_checkout_fields( $fields ) {


    return $fields;

    add_filter( 'woocommerce_billing_fields', 'wc_npr_filter_last_name', 10, 1 );

    function wc_npr_filter_last_name( $address_fields ) {
    $address_fields['billing_last_name']['required'] = false;
    return $address_fields;



  86. Hi,

    I just figured out how to set the below options.

    1.Remove Returning customer option.
    2.Remove Have a Coupon option.
    3.Remove Create an Account option.
    4.Remove Direct transfer option.
    5.Remove cheque payment option.

    I need help in replacing X symbol in cart page to Remove Item label.


  87. Help! Help! Help!
    i already seen your YouTube video tutorial, you only show single tutorial for each video, but when i put two code at a time it's not working, i don't know what's the problem, i am not web developer. Please help me.

    Note: In "bulling" section i want only Country, first name, Last name, email and phone number and "order" section i want to put [ Placeorder ]= '>>> Put the required url or username ', [ lable ]= Facebook – Twitter – Instagram URL/Username'

    // Hook in
    add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );

    // Our hooked in function – $fields is passed via the filter!
    function custom_override_checkout_fields( $fields ) {

    return $fields;
    // Hook in
    add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );

    // Our hooked in function – $fields is passed via the filter!
    function custom_override_checkout_fields( $fields ) {
    $fields['order']['order_comments']['placeholder'] = 'My new placeholder';
    $fields['order']['order_comments']['label'] = 'My new label';
    return $fields;
    } (Not working)

    Please give me the code or please create a video tutorial please

  88. Dear Adam,
    Thank you for all the great information.
    I have a qustion: what is the easiest way to validate the fields in the checkout page, besides setting them required? For example, I want to make sure the client inputs 6 numbers in the postal code field. How do I do that?

    Best regards

  89. Hi Teddy Triton,

    Thanks for tutorial, I tried to customize my website checkout page "billing details" but noting change there. Even if i delete that form-billing.php file from the checkout folder its still doesn't show any change, Can you please help.


  90. Hey Adam.

    These are some GREAT tutorials.

    I have a simple question.How could I add a whole new section similar to "Billing Address" or "Shipping Address"?

    My problem is that custom fields are not shown on confirmation e-mails.

    For example i want to add a field "Choose a color". When someone type "black" i want to receive on my confirmation email "Color: Black"

    Is there a way to do that?

    Thanks again Sir!!

  91. Help please. I was following your tutorial to customize the checkout page. It worked when I entered the first command to change the placeholder text but when I added the second command and saved the changes, everything just went blank and nothing is loading.

  92. Thanks for a great tutorial. Very easy to understand and implement. I was able to add the code and customize it in about 15 mins.

    I do have a question though. What is the best practice to add a drop down/select for options on the fields? I am wanting to add a drop down for referral options on the check out ie: How did you hear about us with drop down options.


  93. HI,

    Thank you for a great post. It has been very helpful.

    I would also like to add this field on the cart page before the check out page. When i use the same code and replace the add_action() aruguments it doesnt work.

    Any help in the right direction would be very helpful

    Many Thanks

  94. Hi Teddy – great tutorial. I can’t find any answers to this question. I’m trying to keep the ‘Payment Method’ and ‘Place Order’ button section above the fold, however they seemed trapped under the parent ‘Order Review’ div, creating one long column. Ideally, it be great to have the checkout page split over 3 columns (as like many digital product sellers, I only need name and email, then they complete details on paypal). Is there a way to achieve this: col 1) name,email (done) col 2 order review table, col 3) payment method select and place order button. All ideas appreciated! Thanks!

  95. Hi Teddy,

    Thanks for posting – been a great help.

    I was wondering if its possible to add a custom field next to where the visitor will need to tick the terms and conditions – Im looking to add a ‘confirm you are over 18’ box.

    Is that possible?


  96. hi Teddy,

    How can we make the TextBox next to the Label Name to save space? Also can you show me/us how to make the Label name on the Payment option next to the radio button (coz the default is in the next line).

  97. Hi Teddy,

    great detailed explanation!
    At first i played around with hooks&filters and it worked great. But to make it easier and more visible (in the backend) for my client i just purchased the WooCommerce Checkout field editor…which does the same and my client can now add or delete fields themselves.

    But…what i can’t figure out (and no plugin or plugin-creator i found) is how to get the data from a custom checkout field stored in the user meta.
    I have fields for a registration number and a birthplace, and they are stored with the order fine, and during checkout all the billing fields are stored in the user meta.
    But when they purchase a product again and login as a returned customer, these custom fields are empty in the checkout.
    They also don’t show up in the ‘my account’ page.

    Since all the woocommerce billing and shipping fields are stored in the user meta, it should be possible to store the custom fields as well…but i can’t figure out how.
    Do you?!


  98. Hi!

    If I will give you the admin details, will you please remove the “country”, “address”, “company name” “town/city” “state/country” “Postcode / Zip” and “Phone ”

    Please do this. I really need help!!

  99. Hi Teddy,

    Your tutorial above was immensely helpful!! It helped solve customising the checkout page but also helped me understand PHP a little better! You have a great way of explain gin things on your videos.

    I was wondering if you’d be able to assist me with understanding how to customise the registration form in woocommerce? Ive tried to apply the same principles as you’ve explained with the checkout form above… but i don’t seem to be getting anywhere.

    Im not trying to add in any new forms, I’m trying to customise some existing text underneath the “Register”, “Register Now” titles. Instead of it saying “Your text here””Your text here” id like to input some custom text.

    Any advise would be greatly appreciated.


  100. Great content! Do you have a tutorial or can provide some information on how I can add a page before the checkout? I want to capture just the email first before they go to the next page to enter address and payment information. I was thinking creating another page, similar to the checkout, but just have the email and once that is filled out, then go to the checkout page.

    Im not a developer, but managed to put pieces of code together to get where I have to go. Thanks.

  101. This was really handy thank you. I’m now also wondering how to handle the extra added fields in the form processing, any tips?

    I don’t want to save the fields as post meta (which $fields does) but rather process the form somehow?

  102. Hi, there is a way to hide specific custom field for specific user role ? I need that only “wholesale” user can view the “vat number” field.. how can i do ? Any suggestion ? Thank you so much,

  103. Great tutorial about adding custom fields to the woocommerce checkout. It’s exactly what I need for my site. I need customers to buy a ticket but then fill in a few questions about themselves. This seems to be set up fine and the fields are there when I make a test purchase. The issue is that on the receipt email, the answers aren’t there and I can’t seem to find them anywhere. I just get ‘customer details’ and ‘billing address’. How can I get the custom field answers to show on the ‘New customer order’ email? Thanks Jamie

  104. Hey Teddy – you are a beast! This is awesome. I’m not experienced at all, but followed along with your video to make a child theme so I can customize my checkout page. I did all the steps, but when I activated the child theme-the menu at the top of my website was messed up (it is sticky and displayed on every page) it’s weird because my logo image doesn’t (just shows broken link icon) and the menu options are displayed almost like I reverted just the header to an old version of how I used to have the menu and the drop down menu options don’t work either. Does that make sense!? The menu is what I used to have and not what it’s supposed to be now. I didn’t look around after that to see if there were others problems, but at first glance everything else seemed to be the same as the parent theme – so I’m confused! How could that happen, can you help me out? Thanks, Andrew.

  105. Hi Teddy,
    I followed your video tutorial to make a child theme. Once I activated it, everything seem to be the first glance, but the header on my pages is messed up. It’s a sticky kind of header that shows at the top of all my sites pages that displays my logo and site navigation menu. The logo image is broken and shows a broken image icon and the menu is not the same as my current menu, it’s like the menu that is shown is a previous way I had it, but I changed the set up of it weeks ago. Nothing else seemed to be different, though I didn’t investigate too hard. Do you know what the cause is or a solution? Thank you, Andrew.

  106. great post Teddy!!
    view your expertise would like to ask how you can by removing the comment custom field in review order , in practice under the box chek the local pickup I would insert a select field with the list of our subsidiaries, Be careful not to speak of the billing form or shipping of the order form but reviuw. you can do it ?
    i hope you understand me beacause my english is very bad 🙂

  107. Hi Teddy, thanks for your great post. I was wondering something I havent found anywhere else and I hope you can help me. I selling tickets with woocommerce to a indoor fleamarket. On my checkout page I would like to upload a picture on a blueprint over the locale, so that the customer can wright in the field which position they want.

    So to clarify, the customer come to the checkout, click on a little thumbnail just beside the field where the can write which place they wish. When they click on the picture it enlarge and they then write in the field which position they want.

    Is it even possible to add a image inside the checkout page? To I do it in the functions.php file in that case?

    Greatful for help!


  108. Hi,
    I want to change placeholder value of address fields.I wrote the following code but still it is showing default text.

    I did this in canvas child theme.please help me on this and I have cleared the cache still on checkout page default address that I entered once comes.Please reply .

  109. Hi,

    Thanks for great article, but after flowing your steps I have noticed that the ” X ” is appearing beside the Checkout and also “s” appearing beside Have a coupon , how do we fix this?

  110. Hi Teddy!

    I noticed that someone asked about “changing WooCommerce checkout fields based on payment gateway”, since that is exactly what I need, do you have update on that?

  111. How to do Woocommerce theme Mystile ckeckout be equal layout of the theme Storefront Chekout? I want column “Billing Details” beside column “Your Oder”, how it’s done in theme StoreFront Checkout.


    —————— ——————–
    Billing Details Your Order

    —————— ——————–
    Ship to …


  112. Hi Teddy
    I am looking to re-calculate the checkout page once the post code has been entered manually, is there a way i can do this or can you point me to a help topic.

  113. Hi teddy, wondered if you can help me?! ive bought a plug in called checkout manager pro for woocommerce and im having trouble with it, it may be something simple but im no genius! I’ve contacted the designers of the plug in and theyre no use! please can you help, the uploaded files that i am having customers upload are going into my media files on my dashboard and not onto my order forms.. is this something you can help with?!


  114. Hi Teddy,

    great tutorials form you!
    Thanks for learning me how to manage this all.

    I also have a question.
    I hope you wil be so kind to show me a way to handle my problem.
    I want to make a tennis court reservation site.
    There is a excelent plugin for this to manage it all.
    It is called: WooCommerce Bookings.

    There is only one thing that i can not get right.
    We have 4 indoor tenniscourts.
    After someone has booked a time slot i have to send him an email where i confirm him wich court he will get.
    So i need a select field in the received booking form that i can set to court 1/court 2/court 4/or court 4.
    After that i need to send my customer an email whit that information.

    Ik hope you can help me or show me a way to handle this.

    Many thanks in advance.

    Wim Wennekes

  115. If I create a cart in the backend for a customer on the checkout page all of these fields go away, but I still want them to check that they agree to terms and conditions.

    How can I force it to show up on admin created carts?

  116. Good day,

    How can I make the checkout page 3 columns, I want to have column 1 (step 1) billing information, Column 2 (step2) shipping and payment method) Column3 (step3) review order and checkout, all of this in one page

  117. Hi,

    Thanks for this useful and enlightening tutorial, but why did you removed the php code destined to modify the checkout page ?! Such a shame 🙁

    Without it this tutorial lose a lot of its core substance. How are we supposed to change the checkout page without the code ?

    I went to your forum but there is nothing as clear and linear as this tutorial…

  118. Hi,
    I would like to change text PRODUCT just below the Your Order in checkout page of woocommerce site. I am using Mystile theme.
    Can you help me please
    Thank you

  119. Hi there! This post couldn’t be written any better!
    Looking through this article reminds me of my previous roommate!
    He constantly kept talking about this. I’ll forward this information to him.
    Fairly certain he will have a good read. Thanks for sharing!

  120. Hi I’m wondering if you are able to help with this one. I am using the Paypal standard plugin provided by UltimateWoo and I am only getting the product name and an order number appearing on the checkout page. We only use a short product name and the rest of the description is in the Product short description field, is there an easy way for the product short description and SKU to be included in the checkout area and in paypal? I am also using the Flatsome theme if this makes a difference.

  121. I copied this into my website and got a horrible fright getting an syntax error message that locked me out of the site. What is wrong with this code that I copied from article above? Does it need updating?

    // Hook in
    add_filter( ‘woocommerce_checkout_fields’ , ‘custom_override_checkout_fields’ );

    // Our hooked in function – $fields is passed via the filter!
    function custom_override_checkout_fields( $fields ) {
    $fields[‘order’][‘order_comments’][‘placeholder’] = ‘My new placeholder’;
    $fields[‘order’][‘order_comments’][‘label’] = ‘My new label’;
    return $fields;

  122. Hi I can translate everything on my pages to serbian and it works great, but I can’t translate the last page-title for the checkout-process. It keeps saying “Order Received”.
    Hours and hours and can’t find solution.
    Can you help me please. Thank you

  123. What an awesome thread of knowledge and woo commerce experience. Thank you for having such information available for free.
    I have a website where I would like to give my clients and opportunity to add a personalized message to the product that they are sending as a gift of gratitude to another colleague or friend recipient. If I create a general “type your personalized message here” entry field, my concern is some people may leave or use a vulgar or offensive message in the field, And then we would potentially print that message and send it out. Or the other option is to create a “select your gratitude message” drop down or check box next to message options.

    Which solution would you use and how/what would you then use as the proper app for that solution?
    Thank you for your help.

  124. Hi,
    How would I replace the “order notes” field you removed in your tutorial with an image?
    Or make all the other fields in the left span across the whole space as it looks unever to me having everything on the left with nothing on the right,
    It looks like this part of the page is two columns so I either want to add an image to the right column or remove the column entirely.

  125. Hi,

    I copy this code and paste it to functions.php. I purposely leave field 1 and field 2 blank to test validation of require field. However, I get this error -> internal server error. May I know how to solve this?

    * Add the field to the checkout 1 + 2
    add_action(‘woocommerce_after_order_notes’, ‘my_custom_checkout_field’);

    function my_custom_checkout_field( $checkout ) {

    echo ”.__(‘Titel Text’).”;

    woocommerce_form_field( ‘THIS_IS_FIELD_1’, array(
    ‘type’ => ‘text’,
    ‘class’ => array(‘my-field-class form-row-wide’),
    ‘label’ => __(‘Label Text 1 *‘),
    ‘placeholder’ => __(‘Placeholder Text 1’),
    ), $checkout->get_value( ‘THIS_IS_FIELD_1’ ));

    woocommerce_form_field( ‘THIS_IS_FIELD_2’, array(
    ‘type’ => ‘text’,
    ‘class’ => array(‘my-field-class form-row-wide’),
    ‘label’ => __(‘Label Text 2 *‘),
    ‘placeholder’ => __(‘Placeholder Text 2’),
    ), $checkout->get_value( ‘THIS_IS_FIELD_2’ ));

    echo ”;


    * Process the checkout 1 + 2
    add_action(‘woocommerce_checkout_process’, ‘THIS_IS_FIELD_1_PROCESS’);

    function THIS_IS_FIELD_1_PROCESS() {
    global $woocommerce;

    // Check if set, if its not set add an error.
    if (!$_POST[‘THIS_IS_FIELD_1’])
    $woocommerce->add_error( __(‘Field 1 is a required field.’) );

    add_action(‘woocommerce_checkout_process’, ‘THIS_IS_FIELD_2_PROCESS’);

    function THIS_IS_FIELD_2_PROCESS() {
    global $woocommerce;

    if (!$_POST[‘THIS_IS_FIELD_2’])
    $woocommerce->add_error( __(‘Field 2 is a required field.’) );

    * Update the order meta with field value 1 + 2
    add_action(‘woocommerce_checkout_update_order_meta’, ‘THIS_IS_FIELD_1_UPDATE’);

    function THIS_IS_FIELD_1_UPDATE( $order_id ) {
    if ($_POST[‘THIS_IS_FIELD_1’]) update_post_meta( $order_id, ‘Field 1 Text’, esc_attr($_POST[‘THIS_IS_FIELD_1’]));

    add_action(‘woocommerce_checkout_update_order_meta’, ‘THIS_IS_FIELD_2_UPDATE’);

    function THIS_IS_FIELD_2_UPDATE( $order_id ) {
    if ($_POST[‘THIS_IS_FIELD_2’]) update_post_meta( $order_id, ‘Field 2 Text’, esc_attr($_POST[‘THIS_IS_FIELD_2’]));

  126. Hi Adam.
    Great information! Keep it up.

    I am new to Woocommerce checkout customization. Exactly because I’ve had, on numerous occasions, to ask for help.
    I find something confusing about the function.php file. Every time you make a change, you return to the file and delete the previous code. Is this just as an example or once the code is deleted those actions remain active?
    In other words, once I start editing either the function.php or style.css files I do leave my changes and keep adding new customizations at the end of the file?

  127. Hi Adam

    I’m relieved to have stumbled across this site:

    In my website I use the WooCommerce plugin. After clicking the CTA button on a sales page, the customer is asked to enter his email address, and then taken to PayPal.

    I have recently been informed that customers using Firefox are unable to see what they are typing when they enter their email address—which causes mistakes to be made.

    I have not had this problem when using Google Chrome, so I presume this is some styling adjustment that needs to be done. Could you possibly tell me what changes need to be made, and where I will find the place where these changes should be made?

    Thanks in advance


  128. hi, i can’t change label address in form billing checkout, i can support. My funciton code

    function custom_checkout_field_label( $fields ) {
    $fields[‘address’][‘label’] = ‘Địa chỉ giao hàng’;
    return $fields;
    add_filter( ‘woocommerce_default_address_fields’, ‘custom_checkout_field_label’ );

Leave a Comment