时间戳

首页 > 解决方案 > 如何在 woocommerce 的帐户详细信息页面中显示自定义用户注册详细信息

php - 如何在 woocommerce 的帐户详细信息页面中显示自定义用户注册详细信息

问题描述

我在 woocommerce 的注册表单中添加了自定义/额外用户详细信息（附图片 - https://i.ibb.co/m5rG84C/stack1.png）。

要添加新的表单元素，我使用了 woocommerce_register_form动作挂钩

add_action( 'woocommerce_register_form', 'Add_extra_register_fields' );

为了保存数据，我使用了 woocommerce_created_customer操作挂钩。

以上所有工作正常。我通过子主题添加了这个。

现在我正在尝试在 Woocommerce 用户登录区域的帐户详细信息页面中显示自定义字段。（附图片 - https://i.ibb.co/pZt4BBk/stack2.png）但我无法做到这一点。有人可以指导我吗？

谢谢

更新 - 我的额外字段的代码如下 -

    function My_extra_register_fields() {?>
   <br><hr>

   <p class="form-row form-row-wide">
    <label for="reg_password_again"><?php _e( 'Please Confirm Password', 'woocommerce' ); ?><span class="required">*</span></label>
    <input type="text" class="input-text" name="user_password_again" id="reg_password_again" />
    </p>

    <p class="form-row form-row-first">
    <label for="reg_billing_first_name"><?php _e( 'First name', 'woocommerce' ); ?><span class="required">*</span></label>
    <input type="text" class="input-text" name="billing_first_name" id="reg_billing_first_name" value="<?php if ( ! empty( $_POST['billing_first_name'] ) ) esc_attr_e( $_POST['billing_first_name'] ); ?>" />
    </p>
    <p class="form-row form-row-last">
    <label for="reg_billing_last_name"><?php _e( 'Last name', 'woocommerce' ); ?><span class="required">*</span></label>
    <input type="text" class="input-text" name="billing_last_name" id="reg_billing_last_name" value="<?php if ( ! empty( $_POST['billing_last_name'] ) ) esc_attr_e( $_POST['billing_last_name'] ); ?>" />
    </p>
    <p class="form-row form-row-wide">
    <label for="reg_dob"><?php _e( 'Date of Birth', 'woocommerce' ); ?><span class="required">*</span></label>
    <input type="text" class="input-text" name="reg_customer_dob" id="reg_customer_dob"  />
    </p>
    
    <p class="form-row form-row-wide">
    <label for="reg_billing_email_cnfrm"><?php _e( 'Please Confirm Email Address ', 'woocommerce' ); ?><span class="required">*</span></label>
    <input type="text" class="input-text" name="billing_email_cnfrm" id="reg_billing_email_cnfrm"  />
    </p>
    <p class="form-row form-row-wide">
    <label for="reg_billing_phone"><?php _e( 'Mobile', 'woocommerce' ); ?><span class="required">*</span></label>
    <input type="text" class="input-text" name="billing_phone" id="reg_billing_phone"  />
    </p>

    <p class="form-row form-row-wide">
    
    <input type="checkbox" name="reg_mkt_email" id=""  />Check 1
    </p>

    <p class="form-row form-row-wide">
    
    <input type="checkbox" name="reg_mkt_number" id=""  />Check 2 
    </p>



    <div class="clear"></div>
    <?php
}
add_action( 'woocommerce_register_form', 'My_extra_register_fields' );

保存额外字段的代码。

    function ___save_extra_register_fields( $customer_id ) {
         if ( isset( $_POST['reg_customer_dob'] ) ) {
            // Phone input filed which is used in WooCommerce
            update_user_meta( $customer_id, 'customer_dob', sanitize_text_field( $_POST['reg_customer_dob'] ) );
           }
    // ............. like this for all ......
    }
add_action( 'woocommerce_created_customer', '___save_extra_register_fields' );

标签： phpwordpresswoocommercehook-woocommerce

解决方案

有两种方法可以做到这一点。

首先，检查这个如何覆盖 WooCommerce 模板文件？

您必须覆盖 form-edit-account.php 文件。

`wp-content/pluings/woocommerce/templates/myaccount/form-edit-account.php`

从此路径复制文件。

`wp-content/pluings/woocommerce/templates/myaccount/form-edit-account.php`

并上传此路径。

`wp-content/themes/your-active-theme-name/woocommerce/myaccount/form-edit-account.php`

现在您可以编辑此文件并添加您的自定义字段。

You can get the `$user` object to this file. and based on that you can get user meta.

其次，您可以使用woocommerce_edit_account_form_start或woocommerce_edit_account_form挂钩来添加您的字段。检查下面的代码。

add_action( 'woocommerce_edit_account_form_start', 'add_my_custom_fileds_to_user_accound_detail_page', 10, 1 );
function add_my_custom_fileds_to_user_accound_detail_page(){
    $user = wp_get_current_user();
    ?>
    <p class="woocommerce-form-row woocommerce-form-row--first form-row form-row-first">
        <label for="my_custom_field"><?php esc_html_e( 'My Custom field', 'woocommerce' ); ?>&nbsp;<span class="required">*</span></label>
        <input type="text" class="woocommerce-Input woocommerce-Input--text input-text" name="my_custom_field" id="my_custom_field" autocomplete="given-name" value="" />
    </p>
    <p class="woocommerce-form-row woocommerce-form-row--last form-row form-row-last">
        <label for="my_custom_field2"><?php esc_html_e( 'My Custom field 2', 'woocommerce' ); ?>&nbsp;<span class="required">*</span></label>
        <input type="text" class="woocommerce-Input woocommerce-Input--text input-text" name="my_custom_field2" id="my_custom_field2" autocomplete="given-name" value="" />
    </p>
    <?php
}

测试和工作

在此处输入图像描述

根据 OP 请求

您可以使用 get_user_meta() 获取自定义数据；

add_action( 'woocommerce_edit_account_form_start', 'add_my_custom_fileds_to_user_accound_detail_page', 10, 1 );
function add_my_custom_fileds_to_user_accound_detail_page(){
    $user = wp_get_current_user();
    ?>
    <p class="form-row form-row-wide">
        <label for="reg_dob"><?php _e( 'Date of Birth', 'woocommerce' ); ?><span class="required">*</span></label>
        <input type="text" class="input-text" name="reg_customer_dob" id="reg_customer_dob" value="<?php echo echo get_user_meta( $user->ID, 'customer_dob', true ); ?>" />
    </p>
    <?php
}

推荐阅读