Home » WooCommerce: Add Shipping Phone @ Checkout

WooCommerce: Add Shipping Phone @ Checkout

by Tutor Aspire

I’m surprised WooCommerce doesn’t offer this field out of the box. Most ecommerce websites actually require a shipping phone to organize delivery and communicate with the end customer in case there are problems.

Thankfully, there is a hook (filter) for that. It’s called “woocommerce_checkout_fields” and can be used to remove, move or add checkout fields quickly. And here’s how to add, for example, a new shipping field called “shipping_phone”. Enjoy!

How to create a new checkout field: shipping phone

PHP Snippet: Display Shipping Phone @ Checkout Fields

/**
 * @snippet       Shipping Phone & Email - WooCommerce
 * @how-to        Get tutoraspire.com FREE
 * @author        Tutor Aspire
 * @compatible    WooCommerce 6
 * @donate $9     https://www.tutoraspire.com
 */

add_filter( 'woocommerce_checkout_fields', 'tutoraspire_shipping_phone_checkout' );

function tutoraspire_shipping_phone_checkout( $fields ) {
$fields['shipping']['shipping_phone'] = array(
'label' => 'Phone',
      'type' => 'tel',
'required' => false,
'class' => array( 'form-row-wide' ),
      'validate' => array( 'phone' ),
'autocomplete' => 'tel',
'priority' => 25,
);
return $fields;
}
 
add_action( 'woocommerce_admin_order_data_after_shipping_address', 'tutoraspire_shipping_phone_checkout_display' );

function tutoraspire_shipping_phone_checkout_display( $order ){
    echo '

Shipping Phone: ' . get_post_meta( $order->get_id(), '_shipping_phone', true ) . '

'; }

You may also like