The stock WordPress user profile is fairly limited in the fields it offers. Lets say you want to add a Facebook or Pinterest field to an author profile? There are a few ways we can go about adding some profile information to the user.

The first way to add fields like a Facebook profile or phone number is to use the user_contactmethods hook by adding the following to your theme’s functions.php file.

// functions.php
    add_filter( 'user_contactmethods', 'profileContactMethods' );

    /**
     * profile contact methods
     *
     * @author  Joe Sexton <joe@webtipblog.com>
     * @param   array $contactMethods
     * @return  array
     */
    function profileContactMethods( $contactmethods ) {
        $contactmethods['phone']      = 'Phone';
        $contactmethods['company']    = 'Company';
        $contactmethods['twitter']    = 'Twitter Username';
        $contactmethods['facebook']   = 'Facebook Username';
        $contactmethods['pinterest']  = 'Pinterest Username';
        $contactmethods['googleplus'] = 'Google Plus Profile URL';
        $contactmethods['linkedin']   = 'LinkedIn Profile URL';

        return $contactmethods;
    }

This method is pretty simply, just add some items to the array of contact methods. These fields will all render under the “Contact Info” section of the user profile in wp-admin. You’ll notice that the company name is located in the contact info section, that doesn’t make a lot of sense. What if you had non-contact related information, maybe you want to add an education section to the user’s profile?

Another alternative is to add new sections to the user profile. This requires a few different hooks, there are two hooks to render the new fields, one to validate, and two more to save.

// functions.php

// render admin profile fields
add_action( 'show_user_profile', 'renderProfileFields' );
add_action( 'edit_user_profile', 'renderProfileFields' );

// validate profile fields
add_action( 'user_profile_update_errors', 'validateProfileFields', 10, 3 );

// save profile fields
add_action( 'edit_user_profile_update', 'saveProfileFields' );
add_action( 'personal_options_update', 'saveProfileFields' );

/**
 * render user profile fields
 *
 * @author  Joe Sexton <joe@webtipblog.com>
 * @param   WP_User $user
 */
function renderProfileFields( WP_User $user ) { ?>

    <h3>Education</h3>
    <table class="form-table">
        <tr>
            <th><label for="education_school">School</label></th>
            <td>
                <input type="text" name="education_school" id="education_school" value="<?php echo esc_attr( get_the_author_meta( 'education_school', $user->ID ) ); ?>" class="regular-text" ><br>
            </td>
        </tr>
        <tr>
            <th><label for="education_date">Dates</label></th>
            <td>
                <input type="text" name="education_date" id="education_date" value="<?php echo esc_attr( get_the_author_meta( 'education_date', $user->ID ) ); ?>" class="regular-text" ><br>
            </td>
        </tr>

    </table>

<? }

/**
 * validate profile fields
 *
 * @author  Joe Sexton <joe@webtipblog.com>
 * @param   WP_Error $errors
 * @param   boolean $update
 * @param   object $user raw user object not a WP_User
 */
function validateProfileFields( WP_Error &$errors, $update, &$user ) {

    // validate input fields
    if ( !empty( $_POST['education_school'] ) && strlen( $_POST['education_school'] ) > 255 && !empty( $_POST['education_school'] ) )
        $errors->add( 'education_school', "<strong>ERROR</strong>: The maximum school length is 255 characters." );

    if ( !empty( $_POST['education_date'] ) && strlen( $_POST['education_date'] ) > 255 && !empty( $_POST['education_date'] ) )
        $errors->add( 'education_date', "<strong>ERROR</strong>: The maximum date length is 255 characters." );

    return $errors;
}

/**
 * save profile fields
 *
 * @author  Joe Sexton <joe@webtipblog.com>
 * @param   int $id
 */
function saveProfileFields( $id ) {

    if ( !current_user_can( 'edit_user', $id ) )
        return false;

    if ( isset( $_POST['education_school'] ) )
        update_user_meta( $id, 'education_school', $_POST['education_school'] );

    if ( isset( $_POST['education_date'] ) )
        update_user_meta( $id, 'education_date', $_POST['education_date'] );
}

This method is a little more complicated but allows you to validate your input a specific way or to add more complex groups of fields to the profile area. To get the new fields simply use get_the_author_meta().

2 comments on “Add Custom User Profile Information to the WordPress Admin Portal

  1. Rse says:

    Having trouble with validation, it shows error but saves field anyway. Have no idea why, tried pretty much all I could find… Some help?

    1. Carlo T. says:

      please read carrefully https://codex.wordpress.org/Plugin_API/Action_Reference/user_profile_update_errors

      user_profile_update_errors hook runs AFTER edit_user_profile_update and personal_options_update. If you want to validate some custom fields before saving, a workaround is to check the $errors array in this same callback, after performing your validations, and save the data if it is empty.

Comments are closed.