Add a custom action button in WooCommerce admin order list

Question

I have followed this instructions to add a custom order status for my WooCommerce Orders.

I can't find a way to create a custom action button that changes the order status to my custom status from the admin order list page like this screenshot:

I would like this custom action button to be shown for the orders that have a "Processing" status.

I could not find any answer in WooCommerce documentation.

Is there a hook to apply these buttons?
How can I add it in the function.php?

Thank you

Here by pressing the button we save a new status, but and is it possible to save or update a meta? with "update_post_meta"? According to an input on the line? I tried with a link but a button would also go : https://stackoverflow.com/questions/59939550/wordpress-add-a-button-to-save-an-order-directly-in-the-order-list — Mickkit, Jan 29 '20 at 09:56

LoicTheAztec · Accepted Answer · 2018-03-13T21:02:35.423

To resume, you have created a custom order status 'wc-parcial' (with the instructions code provided in your question) and you need to add a related action button to orders admin list.

For WooCommerce version 3.3+ check the update in this answer below

You need to use a custom function hooked in woocommerce_admin_order_actions filter hook

// Add your custom order status action button (for orders with "processing" status)
add_filter( 'woocommerce_admin_order_actions', 'add_custom_order_status_actions_button', 100, 2 );
function add_custom_order_status_actions_button( $actions, $order ) {
    // Display the button for all orders that have a 'processing' status
    if ( $order->has_status( array( 'processing' ) ) ) {

        // Get Order ID (compatibility all WC versions)
        $order_id = method_exists( $order, 'get_id' ) ? $order->get_id() : $order->id;
        // Set the action button
        $actions['parcial'] = array(
            'url'       => wp_nonce_url( admin_url( 'admin-ajax.php?action=woocommerce_mark_order_status&status=parcial&order_id=' . $order_id ), 'woocommerce-mark-order-status' ),
            'name'      => __( 'Envio parcial', 'woocommerce' ),
            'action'    => "view parcial", // keep "view" class for a clean button CSS
        );
    }
    return $actions;
}

// Set Here the WooCommerce icon for your action button
add_action( 'admin_head', 'add_custom_order_status_actions_button_css' );
function add_custom_order_status_actions_button_css() {
    echo '<style>.view.parcial::after { font-family: woocommerce; content: "\e005" !important; }</style>';
}

Code goes in function.php file of your active child theme (or theme) or also in any plugin file.

This code is tested and works. You will get that:

LoicTheAztec · Answer 2 · 2019-05-08T01:42:39.647

Updated version for Woocommerce 3.3+

To resume, you have created a custom order status 'wc-parcial' (with the instructions code provided in your question) and you need to add a related action button to orders admin list.

The new code:

// Add your custom order status action button (for orders with "processing" status)
add_filter( 'woocommerce_admin_order_actions', 'add_custom_order_status_actions_button', 100, 2 );
function add_custom_order_status_actions_button( $actions, $order ) {
    // Display the button for all orders that have a 'processing' status
    if ( $order->has_status( array( 'processing' ) ) ) {

        // The key slug defined for your action button
        $action_slug = 'parcial';

        // Set the action button
        $actions[$action_slug] = array(
            'url'       => wp_nonce_url( admin_url( 'admin-ajax.php?action=woocommerce_mark_order_status&status=parcial&order_id=' . $order->get_id() ), 'woocommerce-mark-order-status' ),
            'name'      => __( 'Envio parcial', 'woocommerce' ),
            'action'    => $action_slug,
        );
    }
    return $actions;
}

// Set Here the WooCommerce icon for your action button
add_action( 'admin_head', 'add_custom_order_status_actions_button_css' );
function add_custom_order_status_actions_button_css() {
    $action_slug = "parcial"; // The key slug defined for your action button

    echo '<style>.wc-action-button-'.$action_slug.'::after { font-family: woocommerce !important; content: "\e029" !important; }</style>';
}

Code goes in functions.php file of your active child theme (or active theme).

Tested and works

If you think it isn't working you must click on "adjust view" in the upper right corner and check the "actions" to see it in the table view — Janine Kroser, Jun 07 '18 at 12:14

Add a custom action button in WooCommerce admin order list

2 Answers2

Linked