Extend WooCommerce in Power Automate with new checkout fields

Our Power Automate for WooCommerce plugin is the officially Microsoft certified way to bring WooCommerce to the Power Platform. Customers around the world are using our plugin to build Power Apps and automations through Power Automate that connect WooCommerce with their internal Microsoft systems (like Dynamics 365, Business Central, and F&O.)

Filters to add new WooCommerce address fields to checkout

WooCommerce helpfully adds a few simple filters to make it easy to add new fields to addresses. Here is a guide for customizing checkout fields using actions and filters. In this guide, you’ll learn about a few filters:

• woocommerce_billing_fields lets you add new fields to appear in the Customer’s billing address
• woocommerce_shipping_fields lets you add new fields to appear in the Customer’s shipping address
• woocommerce_checkout_fields lets you control all of the fields presented to a user during checkout

However, these fields are not available through the REST API, this means they won’t be available inside of Power Automate!

You can easily fix this with a little bit of code in your functions.php of your theme, here’s how.

Edit your functions.php in your theme

Let’s walk through how to add custom fields to addresses and also make them available in Power Automate.

First, we’ll add a custom filter that adds the field we want to the shipping address. The following block of code will add a new field called “Phone” to the Shipping Address in the user’s checkout experience.

/**
 * Add a Phone number field to the Shipping address form during checkout
 */
add_filter( 'woocommerce_shipping_fields', function ( $fields ) {
  // This function receives the existing list of shipping fields in $fields
  // You can extend or modify it as you choose.

  $fields[ 'shipping_phone' ] = array(
    'label'       => __( 'Phone', 'woocommerce' ),
    'placeholder' => __x( 'Phone', 'placeholder', 'woocommerce' ),
    'required'    => false,
    'class'       => array( 'form-row-wide' ),
    'clear'       => true
  );

  // You must return the updated list of $fields
  return $fields;
});

This will handle adding a new field called Phone to the Shipping Address for users. It’s displayed during the checkout process and automatically saved because of the special way WooCommerce handles the checkout_fields array.

The custom code above handles everything for the user-facing side, which will allow it to be collected from the user.

This is great, we have a new field, but we are left with few problems.

1. The stored data in the shipping_phone field is not shown anywhere.
2. The checkout_fields extended data is not sent to Power Automate.
3. The new fields are not described in the JSON Schema. Power Automate doesn’t know the field exists.

To resolve, we need to add three more pieces of code to our functions.php

Show the new field in the Admin area

Just because we have a field with data, it doesn’t mean the Order administration shows it.

WooCommerce is programmed only to show what is designed to be rendered through the admin, so if you add new fields, you have to provide instructions for where it will be shown. You don’t automatically see everything that is stored inside of the Order entry.

While this part doesn’t apply to Power Automate, we want to act as good holistic administrators and ensure that everyone who interacts with software we maintain has a good experience. So let’s add a display to the WooCommerce “admin order meta” area so that WordPress/WooCommerce admins can see the new field.

/**
 * Display field value on the order edit page
 */
add_action( 'woocommerce_admin_order_data_after_shipping_address', 'my_custom_checkout_field_display_admin_order_meta', 10, 1 );

function my_custom_checkout_field_display_admin_order_meta($order){
    echo '<p><strong>'. esc_html__( 'Phone From Checkout Form' ) . ':</strong> ' . esc_html( $order->get_meta( '_shipping_phone', true ) ) . '</p>';
}

There. That will add a new bit of text to the Order admin area labeled “Phone From Checkout Form” that should help make sure the store administrators aren’t asking us to dig up details for any specific order.

Next, let’s help the Power Automate users.

Send the custom field to Power Automate

/**
 * Send the field to Power Automate through the REST API
 */
add_filter( 'woocommerce_rest_prepare_shop_order_object', function( $response, $order, $request ) {
  // This function receives WP Rest Response, an Order Object, and the WP REST Request

  $phone = get_post_meta( $order->get_id(), '_shipping_phone', true );
  $response->data['_shipping_phone'] = $phone;

  // You must return the response that will be sent by the API
  return $response;
}, 10, 3);

The function above retrieves the _shipping_phone from the order post meta and includes it in the REST API response for orders. Since the Power Automate plugin uses the REST API, this ensures that the data is sent to Power Automate.

But Power Automate still doesn’t know about the field!

If you leave it like this, then you’ll send the data to Power Automate but it won’t appear as a dynamic field. This is a strikingly similar problem to what the WooCommerce administrators would have had without our display code above.

So let’s add a bit of code that describes the new field to Power Automate, so Power Automate can present it as a Dynamic Field.

Describe the custom field to Power Automate

/**
 * Describe the field in the JSON schema so it can be used as Dynamic Content in Power Automate
 */
add_filter('woocommerce_rest_shop_order_schema', function( $properties ) {
  $properties['_shipping_phone'] = array(
    'description' => __( 'Phone', 'woocommerce' ),
    'type'        => 'string',
    'context'     => array( 'view', 'edit' ),
    'readonly'    => true
});

For each new field in the REST API, you need to describe it in the JSON schema. The JSON Schema is used internally within WordPress to make sure the data is in the right format. Externally, our plugin translates the JSON Schema into a format that Power Automate wants to see. So as long as you have your fields described in the internal JSON Schema, we ensure that they’re available in Power Automate.

Properly built WordPress extensions will ensure that new fields are in the JSON Schema, so if you’re working with a good plugin vendor, you should expect your other plugins, and the fields they add, to automatically be available in Power Automate.

The woocommerce_rest_{$post_type}_schema filter is used to modify the JSON schema, allowing you to add, remove, or update all the fields that will be available in Power Automate.

With all of the code above, you’ve gone through the entire process of adding a new field to be collected from the User at checkout, presented inside the WooCommerce admin area on the Order’s page, sent to Power Automate, and described to Power Automate so it can use it as a Dynamic field.

Repeat this process for every field you want to add (Note, you can use the same filter function for as many fields as you like. You only need to call add_filter once for each part of this.) and you’ll be well on your way to a GREAT experience for all of your users!