【WebP画像】このファイルタイプはセキュリティ上の理由から、許可されていませんを解決

- WordPress -
2020.11.17
WordPress

サイト軽量化・高速化のために今後はJPEG・PNGからWebP画像に切り替えていくか!...と意気込んでいて、さっそくWordpressのメディアへWebPフォーマットの画像をアップロードしようとしたら

このファイルタイプはセキュリティ上の理由から、許可されていません

というエラーに遭遇しアップロード拒否されてしまいました。

Webp画像アップロードセキュリティエラー

このエラーを回避してWebP画像をWordPressのメディアへアップロード出来るようにする方法です。

  1. プラグインを利用する方法
    → ブロガーさんなど非エンジニアのかたへオススメの簡単な方法
  2. WordPressテーマフォルダ内のfunctions.phpに追記編集する方法
    → プラグイン嫌いのかた向け(エンジニアのかた向け)の方法

どちらかあなたの好きなほうで試してみてください。

僕はプラグインは極力使わない派なので、functions.phpを編集する方法で解消しました。

WordPressプラグインでWebP画像のセキュリティエラーを回避する手順

まずは、プラグインを使ってソースコードの編集が不要な安全に作業できる方法からです。

1. WP Add Mime Types をインストール・有効化

WordPress管理画面の プラグイン > 新規追加 > 検索欄で「WP Add Mime Types」と検索し、以下画像通りヒットしたプラグインをインストール・有効化。

Webp画像アップロードセキュリティエラー

2. プラグインの設定変更

有効化後、設定 > Mime Type設定 からプラグイン設定画面へ

Webp画像アップロードセキュリティエラー

設定ページが開いたら、まず以下テキストをコピーします。

テキストwebp = image/webp

設定ページ下部にある「追加の項目」欄へ、コピーしたテキストを貼り付けて忘れずに保存します。

Webp画像アップロードセキュリティエラー

この変更後にもう一度WebP画像をアップロードしてみてください。

エラーが出ることなくアップロードが成功すれば作業は完了です。以下の「functions.phpを編集する方法」は無視していただいてOK。

functions.phpを編集してWebP画像セキュリティエラーを回避する手順

次は、WordPressのfunctions.phpというソースコードを編集する方法です。

ブロガーさんなど非エンジニアのかたでも作業ができるよう、WordPress管理画面のコードエディターから操作する手順で説明していきます。

エンジニアの方はソースコードのみ参考にしてみてください。

ソースコードの編集は慎重に。万が一打ち間違えなどある場合はサイト表示ができなくなる等事故のもとです。

もし「変なコトしちゃったかも」と感じた場合は、何も保存せずブラウザバックをしてページを戻ってから再度編集するようにしましょう。

WordPress管理画面 外観 > テーマエディターをクリック。

Webp画像アップロードセキュリティエラー

画面右側カラムにある「テーマのための関数(functions.php)」をクリック。

Webp画像アップロードセキュリティエラー

以下コードをコピーします(右上のコピーボタンを押すとコピーできます)。

functions.php// webp許可
function custom_mime_types( $mimes ) {
    $mimes['webp'] = 'image/webp';
    return $mimes;
}
add_filter( 'upload_mimes', 'custom_mime_types' );

functions.phpの最下部(どこでもOKですが、分かりやすさのため...)へ貼り付けます。

もし最終行に " ?> " のPHP閉じタグ文字がある場合は、閉じタグより上の行に貼り付けるようにしてください。閉じタグより下へ貼り付けてしまうと保存時にエラーになってしまいます。

以下画像例のように閉じタグがない場合は気にしなくて大丈夫です。

Webp画像アップロードセキュリティエラー

忘れずに保存し、「ファイルの編集に成功しました。」と出ればOK。

この変更後にもう一度WebP画像をアップロードしてみてください。

エラーが出ることなくアップロードが成功すれば作業は完了です。

WebP画像のサムネイルがメディアライブラリで表示されない時

ここまでで「セキュリティ上の理由から、許可されていません」のエラー回避は成功します。

しかし、無事アップロードできたとしても、メディア一覧を見ると以下のようにWebP画像サムネイルが表示されない場合があります。僕はこの事象に遭遇しました。

Webp画像がメディアライブラリでサムネイル表示されない時

これだと何の画像か分からない...

こうなってしまうとどれが何の画像だか分からずとても不便ですよね。

これはfunctions.phpを編集すれば解消できることがわかりました。もしこの事象にぶち当たった場合は以下記事で方法を書いたので参考にしてみてください。

参考WordPress:WebP画像サムネイルがメディアライブラリで表示されない時

↑TOP