Allowing WebP uploads?

Question

I've tried both of these, but I'm still getting the error message: "Sorry, this file type is not permitted for security reasons."

// add support for webp mime types
function webp_upload_mimes( $existing_mimes ) {
    // add webp to the list of mime types
    $existing_mimes['webp'] = 'image/webp';

    // return the array back to the function with our added mime type
    return $existing_mimes;
}

add_filter( 'mime_types', 'webp_upload_mimes' );


function my_custom_upload_mimes($mimes = array()) {

   // add webp to the list of mime types
    $existing_mimes['webp'] = 'image/webp';

    return $mimes;
}

add_action('upload_mimes', 'my_custom_upload_mimes');

Any ideas?

Answer 1

It's necessary to use the wp_check_filetype_and_ext filter to set the mime type and extension for webp files in addition to using the upload_mimes filter to add the mime type to the list of uploadable mimes.

/**
 * Sets the extension and mime type for .webp files.
 *
 * @param array  $wp_check_filetype_and_ext File data array containing 'ext', 'type', and
 *                                          'proper_filename' keys.
 * @param string $file                      Full path to the file.
 * @param string $filename                  The name of the file (may differ from $file due to
 *                                          $file being in a tmp directory).
 * @param array  $mimes                     Key is the file extension with value as the mime type.
 */
add_filter( 'wp_check_filetype_and_ext', 'wpse_file_and_ext_webp', 10, 4 );
function wpse_file_and_ext_webp( $types, $file, $filename, $mimes ) {
    if ( false !== strpos( $filename, '.webp' ) ) {
        $types['ext'] = 'webp';
        $types['type'] = 'image/webp';
    }

    return $types;
}

/**
 * Adds webp filetype to allowed mimes
 * 
 * @see https://codex.wordpress.org/Plugin_API/Filter_Reference/upload_mimes
 * 
 * @param array $mimes Mime types keyed by the file extension regex corresponding to
 *                     those types. 'swf' and 'exe' removed from full list. 'htm|html' also
 *                     removed depending on '$user' capabilities.
 *
 * @return array
 */
add_filter( 'upload_mimes', 'wpse_mime_types_webp' );
function wpse_mime_types_webp( $mimes ) {
    $mimes['webp'] = 'image/webp';

  return $mimes;
}

I tested this on WP v5.0.1 and was able to upload webp files after adding this code.

Answer 2

Sometimes the uploads are limited by your host. Try and define the ALLOW_UNFILTERED_UPLOADS constant that allows upload for every file type:

define( 'ALLOW_UNFILTERED_UPLOADS', true );

Use this in your wp-config.php file for a moment, for testing purposes. Then re-upload your file, and if it still doesn't work, it's probable that the hosting has blocked that file type from being uploaded. Make sure you remove the constant as soon as possible, when you are done trying.

Additionally, You can use the get_allowed_mime_types() function to check the allowed upload mimes.

Answer 3

I was able to get it to work by creating the following plugin. (You just have to add this code to a new file in the /wp-content/plugins/ directory to create the plugin. Make sure you activate the plugin after creating it.)

<?php
/**
 * Plugin Name: WPSE Allow Webp Uploads
 */

function webp_file_and_ext( $mime, $file, $filename, $mimes ) {

    $wp_filetype = wp_check_filetype( $filename, $mimes );
    if ( in_array( $wp_filetype['ext'], [ 'webp' ] ) ) {
        $mime['ext']  = true;
        $mime['type'] = true;
    }

    return $mime;
}
add_filter( 'wp_check_filetype_and_ext', 'webp_file_and_ext', 10, 4 );

function add_webp_mime_type( $mimes ) {
    $mimes['webp'] = 'image/webp';
    return $mimes;
}
add_filter( 'upload_mimes', 'add_webp_mime_type' );