Search code examples
phpwordpressfile-upload

How to add custom file field to user profile in wordpress?


I've found endless examples online on how to add extra custom fields to user profiles in wordpress. But non of them have shown how to add fields to upload files.

Heres what I got for my extra field:

add_action( 'show_user_profile', 'extra_user_profile_fields' );
add_action( 'edit_user_profile', 'extra_user_profile_fields' );

function extra_user_profile_fields( $user ) {
?>
    <h3><?php _e("Extra Information", "blank"); ?></h3>
    <table class="form-table">

        <tr>
            <th><label for="my_document"><?php _e("My Document"); ?></label></th>
            <td>
                <input type="file" name="my_document" id="my_document" value="<?php echo esc_attr( get_the_author_meta( 'my_document', $user->ID ) ); ?>" />
            </td>
        </tr>

    </table>

<?php
}

Then for the form submit:

add_action( 'personal_options_update', 'yoursite_save_extra_user_profile_fields' );
add_action( 'edit_user_profile_update', 'yoursite_save_extra_user_profile_fields' );

function yoursite_save_extra_user_profile_fields( $user_id ) {
    $saved = false;

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

    if(!empty($_FILES['my_document']['name'])) {

        // Use the WordPress API to upload the file
        $upload = wp_upload_bits($_FILES['my_document']['name'], null, file_get_contents($_FILES['my_document']['tmp_name']));

        if(isset($upload['error']) && $upload['error'] != 0) {
            wp_die('There was an error uploading your file. The error is: ' . $upload['error']);
        } else {
            add_post_meta($user_id, 'my_document', $upload);
            update_post_meta($user_id, 'my_document', $upload);
        } // end if/else

    } // end if

}

The document isn't saving, I suspect the form in the edit profile hasn't the tags to upload files. I also don't know how to retrieve the document in the front end once its saved, as to show the user he has the file uploaded.


Solution

  • This works for me:

    add_action( 'show_user_profile', 'extra_user_profile_fields' );
    add_action( 'edit_user_profile', 'extra_user_profile_fields' );
    
    function extra_user_profile_fields( $user ) {
    ?>
        <h3><?php _e("Extra Information", "blank"); ?></h3>
        <table class="form-table">
            <tr>
                <th scope="row">My Document</th>
                <td><input type="file" name="my_document" value="" />
                <?php
                    $doc = get_user_meta( $user->ID, 'my_document', true );
                    if (!isset($doc['error'])) {
                        $doc = $doc['url'];
                        echo "<img src='$doc' />";
                    } else {
                        $doc = $doc['error'];
                        echo $doc;
                    }
                ?>
                </td>
            </tr>
        </table>
    
    <?php
    }
    add_action( 'personal_options_update', 'yoursite_save_extra_user_profile_fields' );
    add_action( 'edit_user_profile_update', 'yoursite_save_extra_user_profile_fields' );
    
    function yoursite_save_extra_user_profile_fields( $user_id ) {
        if ( !current_user_can( 'edit_user', $user_id ) )
            return false;
        if( $_FILES['my_document']['error'] === UPLOAD_ERR_OK ) {
            $_POST['action'] = 'wp_handle_upload';
            $upload_overrides = array( 'test_form' => false );
            $upload = wp_handle_upload( $_FILES['my_document'], $upload_overrides );
            update_user_meta( $user_id, 'my_document', $upload );
        }
    }