¿Cómo crear una página de perfil de edición para usuarios en la interfaz con campos personalizados en wordpress?

8 minutos de lectura

¿Cómo crear una página de perfil de edición para usuarios en la interfaz con campos personalizados en wordpress? Intenté usar el complemento del generador de perfiles, pero no puedo insertar campos personalizados como el cuadro de selección de género, etc.

Puede agregar campos de usuario adicionales en wp-admin, para los usuarios. Use esto en su functions.php, o en su carpeta de complementos:

//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
}

Después de eso, debe guardar sus campos al editar en 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']);

}

Estas funciones agregarán campos personalizados a sus usuarios.

Después de eso, en la interfaz, por supuesto, puedes usar wp_insert_user(); función y wp_update_user(); para registrar y editar un usuario con todos los campos personalizados que creó.

  • Gracias por su respuesta. Pero ya agregué campos personalizados adicionales en el formulario de registro en la interfaz usando el complemento de registro circular. Pero quiero agregar un formulario de edición de perfil en la interfaz donde mis usuarios puedan editar su propio perfil con esos campos en la interfaz. Por favor ayuda.

    – usuario3187719

    23 de enero de 2014 a las 18:32

Puede hacerlo copiando el page.php de su tema en un nuevo archivo llamado algo así como user-profile.php y agregando en la parte superior este código:

<?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;
    }
}
?>

luego reemplace el bucle de esa página con este:

<?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; ?>

y todo lo que le queda por hacer es crear una nueva página y seleccionar el “perfil de usuario” como plantilla de página.

ahora, si todo esto es demasiado, puede usar algunos complementos que hacen el trabajo duro por usted, como:

  • al copiar y pegar, inserte el enlace de origen en su lugar.

    – T. Todua

    8 de octubre de 2016 a las 7:55

  • Hemos utilizado ProfilePress en proyectos anteriores para crear formularios de perfil de edición frontales y no podríamos estar más contentos. ver profilepress.net/features/wordpress-front-end-editar-perfil-formulario

    – W3Guy

    21 de febrero de 2017 a las 12:37

¿Ha sido útil esta solución?