为Woocommerce管理员订单添加自定义订单状态的特定操作按钮图标

Question

我添加了几个新状态，它们都可以正常工作，但是我不知道如何将它们添加为预览中的按钮（“眼睛”）。

也找不到它的钩子。有什么想法吗？

Answer 1

首先在以下代码中，我首先基于自定义状态向管理订单列表添加一个按钮：

add_filter( 'woocommerce_admin_order_actions', 'add_custom_order_status_actions_button_example', 100, 2 );
function add_custom_order_status_actions_button_example( $actions, $order ) {
    // Your custom status (without "wc-")
    $action_slug = 'custom';

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

    return $actions;
}

然后，在下面的代码中，我将图标“眼睛”分配给订购按钮：

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

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

  

图标来自随附的Woocommerce Icon library

代码进入您的活动子主题（活动主题）的function.php文件中。经过测试，可以正常工作。

---

  

或者您可以使用随附的WordPress dashicons icon library

使用此CSS规则代替：font-family: dashicons !important; content: "\f177" !important;