Using WordPress ‘media_upload_form()’ PHP function

by

The media_upload_form WordPress PHP function outputs the legacy media upload form.

Usage

media_upload_form($errors);

Parameters

  • $errors (array) – Optional. Default: null. An array of errors that may occur during the media upload process.

More information

See WordPress Developer Resources: media_upload_form

Examples

Basic usage of media_upload_form

Display the media upload form with no errors.

media_upload_form();

Displaying the media upload form with an error message

Display the media upload form with an error message.

// Define an error array
$errors = array('upload_error' => 'An error occurred during upload.');

// Display the media upload form with errors
media_upload_form($errors);

Displaying the media upload form within a custom admin page

Create a custom admin page with a media upload form.

// Add custom admin page
add_action('admin_menu', 'my_custom_admin_page');

function my_custom_admin_page() {
    add_menu_page('Custom Admin Page', 'Custom Page', 'manage_options', 'custom_page_slug', 'custom_admin_page_content');
}

// Display the media upload form in the custom admin page
function custom_admin_page_content() {
    echo '<h2>Upload Media</h2>';
    media_upload_form();
}

Using media_upload_form in a custom post type

Add a media upload form to a custom post type.

// Register custom post type
add_action('init', 'create_custom_post_type');

function create_custom_post_type() {
    register_post_type('custom_post', array(
        'labels' => array('name' => 'Custom Post'),
        'public' => true,
        'supports' => array('title', 'editor', 'thumbnail')
    ));
}

// Add media upload form to custom post type
add_action('add_meta_boxes', 'add_custom_post_meta_box');

function add_custom_post_meta_box() {
    add_meta_box('custom_post_media_upload', 'Media Upload', 'custom_post_media_upload', 'custom_post', 'side', 'low');
}

function custom_post_media_upload() {
    media_upload_form();
}

Customizing the media_upload_form output using CSS

Apply custom CSS to style the media upload form.

// Add the media upload form
function my_media_upload_form() {
    media_upload_form();
}

// Enqueue custom CSS
add_action('wp_enqueue_scripts', 'enqueue_custom_css');

function enqueue_custom_css() {
    wp_enqueue_style('custom-css', get_template_directory_uri() . '/css/custom.css');
}

In your custom.css file, add the desired styles for the media upload form:

.media-upload-form {
    background-color: #f5f5f5;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
}