如何调整WooCommerce结账页面账户密码字段顺序

问题描述 #

尝试使用以下代码调整WooCommerce结账页面的账户密码字段顺序（将其置于邮箱字段之后），但代码仅生成了一个新字段，并未移动原有的账户密码字段：

function js_sort_checkout_fields( $fields ) {
    $fields['billing']['account_password']['priority'] = 111;

    return $fields;
}
add_filter( 'woocommerce_checkout_fields', 'js_sort_checkout_fields' );

问题根源 #

原代码错误地将account_password字段归到了billing字段组中，但实际上账户密码字段属于account字段组，而非billing组。直接在billing组中定义该字段会创建一个新的自定义字段，而非修改原有账户密码字段的位置。

正确解决方案 #

要将账户密码字段置于邮箱字段之后，需针对account字段组调整其优先级，同时确保字段的显示逻辑匹配需求：

1. 调整账户密码字段优先级 #

邮箱字段默认优先级为100，将账户密码字段的优先级设为110即可让它紧跟在邮箱之后：

function adjust_checkout_account_fields_order( $fields ) {
    // 调整账户密码字段的优先级
    if ( isset( $fields['account']['account_password'] ) ) {
        $fields['account']['account_password']['priority'] = 110;
    }
    return $fields;
}
add_filter( 'woocommerce_checkout_fields', 'adjust_checkout_account_fields_order' );

2. 确保字段显示位置匹配（可选） #

如果需要让账户密码字段在勾选"创建账户"后直接显示在邮箱下方，还可以调整字段的钩子位置，覆盖默认的显示逻辑：

function move_account_password_field_after_email() {
    // 移除默认的账户密码字段钩子
    remove_action( 'woocommerce_after_checkout_billing_form', 'woocommerce_checkout_account_password_field', 10 );
    // 将字段添加到邮箱字段之后的位置
    add_action( 'woocommerce_after_checkout_billing_form', 'woocommerce_checkout_account_password_field', 11 );
}
add_action( 'init', 'move_account_password_field_after_email' );

补充说明 #

• 账户密码字段默认仅在用户勾选"创建账户"选项时显示，上述代码会保持这一默认逻辑，只是调整其显示顺序。
• 若需要强制显示账户密码字段（无需勾选创建账户），可额外添加代码移除创建账户的勾选框并强制显示密码字段，需根据实际场景调整。

内容的提问来源于stack exchange，提问作者Nik7