php 如何使用 wordpress 上的自定义字段为前端用户创建编辑个人资料页面？

How to create a edit profile page for users on frontend with custom fields on wordpress?

提问by user3187719

How to create a edit profile page for users on frontend with custom fields on wordpress? I tried using profile builder plugin but cannot insert custom fields like gender radio box etc.

如何使用 wordpress 上的自定义字段为前端用户创建编辑个人资料页面？我尝试使用配置文件构建器插件，但无法插入自定义字段，如性别单选框等。

回答by Bogdan Rusu

You can add extra user fields in wp-admin, for the users. Use this in your functions.php, or in your plugin folder:

您可以在 wp-admin 中为用户添加额外的用户字段。在您的functions.php 或您的插件文件夹中使用它：

//extra user info in wp-admin
add_action( 'show_user_profile', 'yoursite_extra_user_profile_fields' );
add_action( 'edit_user_profile', 'yoursite_extra_user_profile_fields' );
function yoursite_extra_user_profile_fields( $user ) {
?>
  <h3><?php _e("Extra profile information", "blank"); ?></h3>
  <table class="form-table">
    <tr>
      <th><label for="company"><?php _e("Company"); ?></label></th>
      <td>
        <input type="text" name="company" id="company" class="regular-text" 
            value="<?php echo esc_attr( get_the_author_meta( 'company', $user->ID ) ); ?>" /><br />
    </td>
    </tr>   
    <tr>
      <th><label for="job"><?php _e("Job"); ?></label></th>
      <td>
        <input type="text" name="job" id="job" class="regular-text" 
            value="<?php echo esc_attr( get_the_author_meta( 'job', $user->ID ) ); ?>" /><br />
    </td>
    </tr>    
    <tr>
      <th><label for="country"><?php _e("Country"); ?></label></th>
      <td>
        <input type="text" name="country" id="country" class="regular-text" 
            value="<?php echo esc_attr( get_the_author_meta( 'country', $user->ID ) ); ?>" /><br />
    </td>
    </tr>
    <tr>
      <th><label for="city"><?php _e("City"); ?></label></th>
      <td>
        <input type="text" name="city" id="city" class="regular-text" 
            value="<?php echo esc_attr( get_the_author_meta( 'city', $user->ID ) ); ?>" /><br />
    </td>
    </tr>     
    <tr>
      <th><label for="phone"><?php _e("Phone"); ?></label></th>
      <td>
        <input type="text" name="phone" id="phone" class="regular-text" 
            value="<?php echo esc_attr( get_the_author_meta( 'phone', $user->ID ) ); ?>" /><br />
    </td>
    </tr>

  </table>
<?php
}

After that you must save your fields when editing in wp-admin

之后，您必须在 wp-admin 中编辑时保存您的字段

//Save our extra registration user meta.
add_action('user_register', 'myplugin_user_register'); 
function myplugin_user_register ($user_id) {
    if ( isset( $_POST['phone'] ) )
        update_user_meta($user_id, 'phone', $_POST['phone']);   

    if ( isset( $_POST['company'] ) )
        update_user_meta($user_id, 'company', $_POST['company']);

    if ( isset( $_POST['job'] ) )
        update_user_meta($user_id, 'job', $_POST['job']);   

    if ( isset( $_POST['country'] ) )
        update_user_meta($user_id, 'country', $_POST['country']);   

    if ( isset( $_POST['city'] ) )
        update_user_meta($user_id, 'city', $_POST['city']);

    if ( isset( $_POST['user_interest'] ) )
        update_user_meta($user_id, 'user_interest', $_POST['user_interest']);

}

This functions will add custom fields to your users.

此函数将为您的用户添加自定义字段。

After that, in the frontend, of course you can use wp_insert_user(); function and wp_update_user(); to register and edit a user with all custom fields you created.

之后，在前端，当然可以使用 wp_insert_user(); 函数和 wp_update_user(); 使用您创建的所有自定义字段注册和编辑用户。

回答by Rahul Shinde

You can do that by copy your theme's page.php to a new file named something like user-profile.php and add to the very top of it this code:

您可以通过将主题的 page.php 复制到名为 user-profile.php 之类的新文件并在其最顶部添加以下代码来做到这一点：

<?php
/**
 * Template Name: User Profile
 *
 * Allow users to update their profiles from Frontend.
 *
 */

/* Get user info. */
global $current_user, $wp_roles;
//get_currentuserinfo(); //deprecated since 3.1

/* Load the registration file. */
//require_once( ABSPATH . WPINC . '/registration.php' ); //deprecated since 3.1
$error = array();    
/* If profile was saved, update profile. */
if ( 'POST' == $_SERVER['REQUEST_METHOD'] && !empty( $_POST['action'] ) && $_POST['action'] == 'update-user' ) {

    /* Update user password. */
    if ( !empty($_POST['pass1'] ) && !empty( $_POST['pass2'] ) ) {
        if ( $_POST['pass1'] == $_POST['pass2'] )
            wp_update_user( array( 'ID' => $current_user->ID, 'user_pass' => esc_attr( $_POST['pass1'] ) ) );
        else
            $error[] = __('The passwords you entered do not match.  Your password was not updated.', 'profile');
    }

    /* Update user information. */
    if ( !empty( $_POST['url'] ) )
        wp_update_user( array( 'ID' => $current_user->ID, 'user_url' => esc_url( $_POST['url'] ) ) );
    if ( !empty( $_POST['email'] ) ){
        if (!is_email(esc_attr( $_POST['email'] )))
            $error[] = __('The Email you entered is not valid.  please try again.', 'profile');
        elseif(email_exists(esc_attr( $_POST['email'] )) != $current_user->id )
            $error[] = __('This email is already used by another user.  try a different one.', 'profile');
        else{
            wp_update_user( array ('ID' => $current_user->ID, 'user_email' => esc_attr( $_POST['email'] )));
        }
    }

    if ( !empty( $_POST['first-name'] ) )
        update_user_meta( $current_user->ID, 'first_name', esc_attr( $_POST['first-name'] ) );
    if ( !empty( $_POST['last-name'] ) )
        update_user_meta($current_user->ID, 'last_name', esc_attr( $_POST['last-name'] ) );
    if ( !empty( $_POST['description'] ) )
        update_user_meta( $current_user->ID, 'description', esc_attr( $_POST['description'] ) );

    /* Redirect so the page will show updated info.*/
  /*I am not Author of this Code- i dont know why but it worked for me after changing below line to if ( count($error) == 0 ){ */
    if ( count($error) == 0 ) {
        //action hook for plugins and extra fields saving
        do_action('edit_user_profile_update', $current_user->ID);
        wp_redirect( get_permalink() );
        exit;
    }
}
?>

then replace the loop of that page with this one:

然后用这个替换该页面的循环：

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    <div id="post-<?php the_ID(); ?>">
        <div class="entry-content entry">
            <?php the_content(); ?>
            <?php if ( !is_user_logged_in() ) : ?>
                    <p class="warning">
                        <?php _e('You must be logged in to edit your profile.', 'profile'); ?>
                    </p><!-- .warning -->
            <?php else : ?>
                <?php if ( count($error) > 0 ) echo '<p class="error">' . implode("<br />", $error) . '</p>'; ?>
                <form method="post" id="adduser" action="<?php the_permalink(); ?>">
                    <p class="form-username">
                        <label for="first-name"><?php _e('First Name', 'profile'); ?></label>
                        <input class="text-input" name="first-name" type="text" id="first-name" value="<?php the_author_meta( 'first_name', $current_user->ID ); ?>" />
                    </p><!-- .form-username -->
                    <p class="form-username">
                        <label for="last-name"><?php _e('Last Name', 'profile'); ?></label>
                        <input class="text-input" name="last-name" type="text" id="last-name" value="<?php the_author_meta( 'last_name', $current_user->ID ); ?>" />
                    </p><!-- .form-username -->
                    <p class="form-email">
                        <label for="email"><?php _e('E-mail *', 'profile'); ?></label>
                        <input class="text-input" name="email" type="text" id="email" value="<?php the_author_meta( 'user_email', $current_user->ID ); ?>" />
                    </p><!-- .form-email -->
                    <p class="form-url">
                        <label for="url"><?php _e('Website', 'profile'); ?></label>
                        <input class="text-input" name="url" type="text" id="url" value="<?php the_author_meta( 'user_url', $current_user->ID ); ?>" />
                    </p><!-- .form-url -->
                    <p class="form-password">
                        <label for="pass1"><?php _e('Password *', 'profile'); ?> </label>
                        <input class="text-input" name="pass1" type="password" id="pass1" />
                    </p><!-- .form-password -->
                    <p class="form-password">
                        <label for="pass2"><?php _e('Repeat Password *', 'profile'); ?></label>
                        <input class="text-input" name="pass2" type="password" id="pass2" />
                    </p><!-- .form-password -->
                    <p class="form-textarea">
                        <label for="description"><?php _e('Biographical Information', 'profile') ?></label>
                        <textarea name="description" id="description" rows="3" cols="50"><?php the_author_meta( 'description', $current_user->ID ); ?></textarea>
                    </p><!-- .form-textarea -->

                    <?php 
                        //action hook for plugin and extra fields
                        do_action('edit_user_profile',$current_user); 
                    ?>
                    <p class="form-submit">
                        <?php echo $referer; ?>
                        <input name="updateuser" type="submit" id="updateuser" class="submit button" value="<?php _e('Update', 'profile'); ?>" />
                        <?php wp_nonce_field( 'update-user' ) ?>
                        <input name="action" type="hidden" id="action" value="update-user" />
                    </p><!-- .form-submit -->
                </form><!-- #adduser -->
            <?php endif; ?>
        </div><!-- .entry-content -->
    </div><!-- .hentry .post -->
    <?php endwhile; ?>
<?php else: ?>
    <p class="no-data">
        <?php _e('Sorry, no page matched your criteria.', 'profile'); ?>
    </p><!-- .no-data -->
<?php endif; ?>

and all that is left for you to do is create a new page and select the "user profile" as the page template.

剩下要做的就是创建一个新页面并选择“用户配置文件”作为页面模板。

now if all of this is too much you can use some plugins that do the hard work for you like:

现在，如果所有这些都太多了，您可以使用一些为您完成艰苦工作的插件，例如：

• Frontend Edit Profile
• WP User Frontend
• Theme My Login

• 前端编辑配置文件
• WP 用户前端
• 主题我的登录