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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

テキストwebp = image/webp

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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