0

I'm working on a theme settings page and I need to allow uploading WOFF and WOFF2 files. Getting the

Sorry, this file type is not permitted for security reasons.

message at this time.

My code:

  function my_mime_types($mimes = array()) {
    // $mimes['svg']   = 'image/svg+xml'; // insecure; do not use!
    // Try https://wordpress.org/plugins/safe-svg/ if you need to upload SVGs
    $mimes['webp']  = 'image/webp';
    $mimes['ogg']   = 'audio/ogg';
    $mimes['woff']  = 'font/woff';
    $mimes['woff2'] = 'font/woff2';
    return $mimes;
  }

  add_filter( 'upload_mimes', 'my_mime_types' );

I ran file --mime-type -b /path/to/fonts/font.woff, which returned application/octet-stream so I updated the code but that still didn't work. I've also tried application/x-font-woff unsuccessfully.

I also get the error with a .webp file. The mime type matches; confirmed by running mime-type.

I understand that the most recent Wordpress versions employ strict mime type checking. Could that be the culprit? Is there a solution to this?

UPDATE: Working code based on Ram Ratan Maurya's answer:

add_filter( 'wp_check_filetype_and_ext', 'my_file_and_ext_webp', 10, 4 );
function my_file_and_ext_webp( $types, $file, $filename, $mimes ) {
    if ( false !== strpos( $filename, '.webp' ) ) {
        $types['ext']  = 'webp';
        $types['type'] = 'image/webp';
    }
    if ( false !== strpos( $filename, '.ogg' ) ) {
        $types['ext']  = 'ogg';
        $types['type'] = 'audio/ogg';
    }
    if ( false !== strpos( $filename, '.woff' ) ) {
        $types['ext']  = 'woff';
        $types['type'] = 'font/woff|application/font-woff|application/x-font-woff|application/octet-stream';
    }
    if ( false !== strpos( $filename, '.woff2' ) ) {
        $types['ext']  = 'woff2';
        $types['type'] = 'font/woff2|application/octet-stream|font/x-woff2';
    }

    return $types;
}

function my_mime_types($mimes) {
  // $mimes['svg']   = 'image/svg+xml'; // insecure; do not use! Try https://wordpress.org/plugins/safe-svg/ if you need to upload SVGs
  $mimes['webp']  = 'image/webp';
  $mimes['ogg']   = 'audio/ogg';
  $mimes['woff']  = 'font/woff|application/font-woff|application/x-font-woff|application/octet-stream';
  $mimes['woff2'] = 'font/woff2|application/octet-stream|font/x-woff2';
  return $mimes;
}

add_filter( 'upload_mimes', 'my_mime_types' );
1

I see a correct implementation at https://wordpress.stackexchange.com/a/323226/24756. Technically, you need to pass down the extension down to filter wp_check_filetype_and_ext as well.

And for WOFF/WOFF2, I'd suggest using the following format:

$mimes['woff']  = 'font/woff|application/font-woff|application/x-font-woff|application/octet-stream';
$mimes['woff2'] = 'font/woff2|application/octet-stream|font/x-woff2';

For .webp, it can simply be image/webp.

Hope it helps.

3
  • That worked, except it should be = and not =>. – Chris J. Zähller May 27 '19 at 16:47
  • If you correct the code I'll mark this as the correct answer. – Chris J. Zähller May 27 '19 at 16:58
  • @Chris Done! It wasn't technically wrong, just an array of key/values. I usually keep common values in a separate function and use it across common calls. Updated the snippet to match your use case đź‘Ť – Ram Ratan Maurya May 28 '19 at 12:09

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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