WordPress Custom Fields User Profile Page

WordPress Add Custom Fields User Edit Profile Page – In this post we see how we can add custom fields to user profile edit page in WordPress at admin end. When admin wants to add some extra information for the users in his/her site, then custom fields can play important role.

As we know, WordPress provides hooks for almost every other feature/functionality so that we can update or manipulate according to our need. So for this also we’ll use some hooks to fulfill our post purpose.

Let’s start with the code –

<?php
 
/**
*  @param $user
*  @author Webkul
*/
 
add_action( 'edit_user_profile', 'wk_custom_user_profile_fields' );
 
function wk_custom_user_profile_fields( $user )
{
    echo '<h3 class="heading">Custom Fields</h3>';
    
    ?>
    
    <table class="form-table">
  <tr>
            <th><label for="contact">Contact</label></th>
 
      <td><input type="text" class="input-text form-control" name="contact" id="contact" />
            </td>
 
  </tr>
    </table>
    
    <?php
}
 
?>

In above code, we add action to hook ‘edit_user_profile’ and create one input field in callback function. This function will display field when you are editing other user profile. If you want to show created fields for all profiles then use ‘show_user_profile’ hook and add action for same callback function.

<?php
add_action( 'show_user_profile', 'wk_custom_user_profile_fields' );
?>

After executing above code, custom field will display on user profile edit page as below –

Now, to save the data for created custom fields we’ll use ‘edit_user_profile_update’ hook.

<?php

add_action( 'edit_user_profile_update', 'wk_save_custom_user_profile_fields' );

/**
*   @param User Id $user_id
*/
function wk_save_custom_user_profile_fields( $user_id )
{
    
    $custom_data = $_POST['contact'];
    update_user_meta( $user_id, 'contact', $custom_data );

}

?>