I'm trying to upload images from the frontend using Wordpress default media uploader, so I used wp_enqueue_media(). It imports all the scripts but not the styles. See the screenshot below

After using the inspect tool I found out that it was not loading the load-styles.php from wp-includes. How do I fix this?

I'm trying to upload images from the frontend using Wordpress default media uploader, so I used wp_enqueue_media(). It imports all the scripts but not the styles. See the screenshot below

After using the inspect tool I found out that it was not loading the load-styles.php from wp-includes. How do I fix this?

• css
• media-library

• The styles are imported, but your theme's styles are overwriting some of them. You'll need to manually fix any issues with your own CSS. – Jacob Peattie Commented Mar 16, 2020 at 23:29
• I thought that might be the issue, so I created a theme file with no css of my own (or any frameworks) and just used the media uploader. But it still has the same issues. Not loading styles – iDev Commented Mar 17, 2020 at 1:06

1 Answer 1

There are some wp-admin styles you need to load.

Since I cannot find any way to let wp_enqueue_style() accept url parameters, so I load styles by wp_head hook function here.

add_action( 'wp_head', 'load_admin_media_styles', 10);
function load_admin_media_styles(){
    // list all style libs the post page of wp-admin loaded, but we may only need to load 2 of them
    $ary_libs = array(
        'common','forms',
        // 'dashicons', 'admin-bar','buttons','media-views',
        // 'admin-menu','dashboard','list-tables','edit','revisions','media','themes','about','nav-menu',
        // 's','wp-pointer','widgets','site-icon','l10n','wp-auth-check','wp-color-picker'
    );
    $admin_media_styles_url = add_query_arg(
        array(
            'c' => 0,
            'dir' => 'ltr',
            'load[]' => implode(',', $ary_libs),
            'ver' => 'you_wp_version'
        ),
        admin_url().'load-styles.php'
    );
    echo "<link rel='stylesheet' id='admin_styles_for_media-css' href='".$admin_media_styles_url."' type='text/css' media='all' />";
}

I tried in my localhost and it works, hope this helps you.