I created extra fields for my subscribers, one of them is an image field, so they can upload an image to their profile.

I created the fields with ACF (Advanced Custom Fields).

I have a custom register form and a custom edit form, with the regular WordPress fields and the extra ones. Everything works perfectly... Except for the image field.

I'm not worried about the register form, I accept that the user won't upload the image when registering, but I need them to be able to edit/upload the image when editting their info.

Ps.(1):The image will be used as the avatar, I won't use the regular WordPress avatar.

Ps.(2):I won't use the acf_form() because I need to edit too much on how the form works.

Here is part of the code:

<label for="avatar_user"></label>
<input class="text-input" name="avatar_user" type="file" id="avatar_user" value="<?php the_author_meta( 'avatar_user', $current_user->ID ); ?>" />

if ( !empty( $_POST['avatar_user'] ) ) :
   update_user_meta( $current_user->ID, 'avatar_user', esc_attr( $_POST['avatar_user'] ) );
  • acf allows you to store image url also, you can handle your custom avatar upload via media_handle_upload() function in wordpress and insert the url into acf field Commented Oct 11, 2017 at 12:20
  • 1
    so what is actually the question? please edit the question and clarify what is it you are actually asking Commented Oct 11, 2017 at 12:46
  • The question is pretty clear in the title and in the text. No need to edit. Commented Oct 11, 2017 at 12:50
  • I think 'media_handle_upload()' might do the trick. Will try as soon as I can and see if it works. Thnx @Piyush Commented Oct 11, 2017 at 12:52
  • @MarceloHenriquesCortez yes...i have done it previously...but don't know your use case..so you can check if it works out Commented Oct 11, 2017 at 12:55

2 Answers 2


Ok, I got it to work with the 'media_handle_upload' (pointed out by @Piyush) and tweaking a little bit with my form code.

So, here is what I did:

First - Make sure your form has the attribute 'enctype='multipart/form-data'.

Second - Be sure that your 'input=file' has no value attribute.

Third - Use the 'media_handle_upload' and pass the name of your 'input=file'.

Forth - Check if there was an error with 'is_wp_error', for example.

Fifth - Update the user meta using the name of the field you want to update (in my case, is the same as the 'name' of the 'input=file'.

Here is part of the final code:

<form method="post" id="adduser" enctype='multipart/form-data'>
    <input class="text-input" name="avatar_user" type="file" id="avatar_user" multiple="false"/>
    <input name="updateuser" type="submit" id="updateuser" class="submit button" value="<?php _e('GRAVAR', 'profile'); ?>" />
    <input name="action" type="hidden" id="action" value="update-user" />

/* If profile was saved, update profile. */
if ( 'POST' == $_SERVER['REQUEST_METHOD'] && !empty( $_POST['action'] ) && $_POST['action'] == 'update-user' ) {

    // These files need to be included as dependencies when on the front end.
    require_once( ABSPATH . 'wp-admin/includes/image.php' );
    require_once( ABSPATH . 'wp-admin/includes/file.php' );
    require_once( ABSPATH . 'wp-admin/includes/media.php' );

    // Let WordPress handle the upload.
    $img_id = media_handle_upload( 'avatar_user', 0 );

    if ( is_wp_error( $img_id ) ) {
      echo "Error";
    } else {
      update_user_meta( $current_user->ID, 'avatar_user', $img_id );

Maybe something like this will help :

// Deal with images uploaded from the front-end while allowing ACF to do it's thing
function my_acf_pre_save_post($post_id) {

if ( !function_exists('wp_handle_upload') ) {
require_once(ABSPATH . 'wp-admin/includes/file.php');

// Move file to media library
$movefile = wp_handle_upload( $_FILES['my_image_upload'], array('test_form' => false) );

// If move was successful, insert WordPress attachment
if ( $movefile && !isset($movefile['error']) ) {
$wp_upload_dir = wp_upload_dir();
$attachment = array(
'guid' => $wp_upload_dir['url'] . '/' . basename($movefile['file']),
'post_mime_type' => $movefile['type'],
'post_title' => preg_replace( '/\.[^.]+$/', ”, basename($movefile['file']) ),
'post_content' => ”,
'post_status' => 'inherit'
$attach_id = wp_insert_attachment($attachment, $movefile['file']);

// Assign the file as the featured image
set_post_thumbnail($post_id, $attach_id);
update_field('my_image_upload', $attach_id, $post_id);


return $post_id;


add_filter('acf/pre_save_post' , 'my_acf_pre_save_post');

Copy the code from this post, the page I linked to below breaks the formatting so I've fixed it in the above sample.

Source : https://support.advancedcustomfields.com/forums/topic/uploading-imagefile-on-the-front-end/

  • Sounds promissing. Will give it a try as soon as I can. Thnx Commented Oct 11, 2017 at 12:54
  • The problem with this example is that it seems to be used for a post, that why they use 'set_post_thumbnail'. In my case, I need to use the image on a ACF input, on the user profile. Commented Oct 16, 2017 at 10:58
  • Got it to work with 'media_handle_upload()' Commented Oct 16, 2017 at 11:56
  • 1
    I tagged it as useful cuz it probably can help other users on specific matters. Since I found the solution that works with my code, dunno if it will work with everyone. Commented Oct 16, 2017 at 14:21

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.