如何在其他字段之间向我的帐户详细信息添加新字段

Question

通过下面的 sn-p，我们将帐单电话字段添加到帐户编辑详细信息。

这没有问题，只是我们希望在电子邮件和密码更改部分字段之间添加新字段。

add_action( 'woocommerce_edit_account_form_start', 'misha_add_field_edit_account_form' );
// or add_action( 'woocommerce_edit_account_form', 'misha_add_field_edit_account_form' );
function misha_add_field_edit_account_form() {

    woocommerce_form_field(
        'billing_phone',
        array(
            'type'        => 'text',
            'required'    => true, // remember, this doesn't make the field required, just adds an "*"
            'label'       => 'Phone',
            'description' => 'add your phone number',
        ),
        get_user_meta( get_current_user_id(), 'billing_phone', true ) // get the data
    );

}

/**
 * Step 2. Save field value
 */
add_action( 'woocommerce_save_account_details', 'misha_save_account_details' );
function misha_save_account_details( $user_id ) {

    update_user_meta( $user_id, 'billing_phone', sanitize_text_field( $_POST['billing_phone'] ) );

}

/**
 * Step 3. Make it required
 */
add_filter('woocommerce_save_account_details_required_fields', 'misha_make_field_required');
function misha_make_field_required( $required_fields ){

    $required_fields['billing_phone'] = 'Phone';
    return $required_fields;

}

Answer 1

推荐您应用代码的方式。但是，因为您想在一个非常具体的地方添加新字段，所以我建议如下

第一步：覆盖模板文件

https://github.com/woocommerce/woocommerce/blob/3.8.0/templates/myaccount/form-edit-account.php

• 可以通过将其复制到 yourtheme/woocommerce/myaccount/form-edit-account.php 来覆盖此模板。

替换：第 42 - 47 行

<p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">
    <label for="account_email"><?php esc_html_e( 'Email address', 'woocommerce' ); ?>&nbsp;<span class="required">*</span></label>
    <input type="email" class="woocommerce-Input woocommerce-Input--email input-text" name="account_email" id="account_email" autocomplete="email" value="<?php echo esc_attr( $user->user_email ); ?>" />
</p>

// ADD NEW FIELD HERE

<fieldset>

有

<p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">
    <label for="account_email"><?php esc_html_e( 'Email address', 'woocommerce' ); ?>&nbsp;<span class="required">*</span></label>
    <input type="email" class="woocommerce-Input woocommerce-Input--email input-text" name="account_email" id="account_email" autocomplete="email" value="<?php echo esc_attr( $user->user_email ); ?>" />
</p>

<p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide">
    <label for="billing_phone"><?php esc_html_e( 'Billing phone', 'woocommerce' ); ?>&nbsp;<span class="required">*</span></label>
    <input type="tel" class="woocommerce-Input woocommerce-Input--text input-text" name="billing_phone" id="billing_phone" autocomplete="tel" value="<?php echo esc_attr( $user->billing_phone ); ?>" />
</p>

<fieldset>

---

第 2 步和第 3 步

要保存并验证您可以保留现有代码的字段（我稍微调整了这些）

/**
 * Save field value
 */
function my_save_account_details( $user_id ) {
    if( isset( $_POST['billing_phone'] ) ) {
        update_user_meta( $user_id, 'billing_phone', sanitize_text_field( $_POST['billing_phone'] ) );
    }
}
add_action( 'woocommerce_save_account_details', 'my_save_account_details' );

/**
 * Make it required
 */
function my_save_account_details_required_fields( $required_fields ){    
    $required_fields['billing_phone'] = 'Billing phone';
    return $required_fields;
}
add_filter('woocommerce_save_account_details_required_fields', 'my_save_account_details_required_fields');