Upload Images from the Front End and Attach Them to Posts in WordPress

When developing WordPress themes, it is common to run into requirements for uploading images from the front end. At first glance, it can seem troublesome. In reality, WordPress already provides a very simple interface for this, and uploading attachments only takes a few lines of code.

The main work is to include a few required files and then use media_handle_upload together with update_post_meta. Let us look at the code.

function insert_attachment($file_handler, $post_id, $set_thumb = 'false')
{
    // Check whether the file upload succeeded
    if ($_FILES[ $file_handler ][ 'error' ] !== UPLOAD_ERR_OK) {
        return false;
    }

    require_once(ABSPATH . "wp-admin" . '/includes/image.php');
    require_once(ABSPATH . "wp-admin" . '/includes/file.php');
    require_once(ABSPATH . "wp-admin" . '/includes/media.php');

    // Upload to the Media Library and return the attachment ID
    $attach_id = media_handle_upload($file_handler, $post_id);

    // Attach the uploaded file to the post
    if ($set_thumb) {
        update_post_meta($post_id, '_thumbnail_id', $attach_id);
    }

    return $attach_id;
}

If you are uploading multiple files, you need to modify the function a little, like this:

function insert_multiple_attachment($file_handler, $post_id)
{
    require_once(ABSPATH . "wp-admin" . '/includes/image.php');
    require_once(ABSPATH . "wp-admin" . '/includes/file.php');
    require_once(ABSPATH . "wp-admin" . '/includes/media.php');

    $files = $_FILES[ $file_handler ];

    foreach ($files[ 'name' ] as $key => $value) {
        if ($files[ 'name' ][ $key ]) {
            $file = [
                'name'     => $files[ 'name' ][ $key ],
                'type'     => $files[ 'type' ][ $key ],
                'tmp_name' => $files[ 'tmp_name' ][ $key ],
                'error'    => $files[ 'error' ][ $key ],
                'size'     => $files[ 'size' ][ $key ],
            ];

            // Skip the file if the upload was not OK
            if ($file[ 'error' ] !== UPLOAD_ERR_OK) {
                continue;
            }

            $_FILES = [$file_handler => $file];

            foreach ($_FILES as $file => $array) {
                // Upload to the Media Library and return the attachment ID
                $attach_id = media_handle_upload($file, $post_id);

                // Attach the uploaded file to the post
                update_post_meta($post_id, '_gallery_image_id', $attach_id);
            }

        }
    }
}

How to use the functions above

This part is intended for beginners, so advanced users can skip it. When calling the function, just pass PHP’s global $_FILES variable as the first argument and the target post ID as the second argument.

if ($_FILES) {
	foreach ($_FILES as $file => $array) {
		$newupload = insert_attachment($file,$post_id);
	}
}

After the file upload succeeds, the result you see in the WordPress dashboard is the same as if you had inserted the featured image directly from the back end. Very simple, right? If you know an even simpler way, feel free to share it in the comments.

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *