WooCommerce Show Custom Content Under Checkout Fields

About This Solution

Sometimes, you may wish to provide additional instructions to your customers when they are completing the WooCommerce Checkout form. This quick guide shows you how you can add any custom content you like under the fields using. This particular solution shows you how you can add the text “As shown on your passport” under the first name billing field. To add custom content under other fields, simply change the snippet as appropriate.

/**
* Snippet Name:     Show custom text (field descriptions) under WooCommerce checkout fields.
* Snippet Author:   ecommercehints.com
*/

add_filter( 'woocommerce_billing_fields' , 'ecommercehints_custom_content_under_checkout_fields' );

function ecommercehints_custom_content_under_checkout_fields( $fields ) {

$fields['billing_first_name']['description'] = 'As shown on your passport';
return $fields;
}

Want The Content To Stay In Place?

Default behaviour means the field description disappears when the field has focus e.g. when you click the field to begin to populate it, the description will disappear. To keep it in place, even on focus, add the following CSS to the checkout page

<style>
#billing_first_name-description {
    display: inline !important;
}
</style>