ミギムキ

[WordPress] svgファイルをアップロードしたい(WPバージョン6.2以降対応)

WordPressでは、セキュリティの観点からメディアライブラリにアップロードできるファイルに制限があります。svgファイルもその制限対象の一つになりますが、アイコン画像としてsvg形式のファイルを使用したいというケースがあります。
本記事では、svgファイルをメディアライブラリにアップロードするための方法を解説します。

手順①「wp-config.php」の修正

define('ALLOW_UNFILTERED_UPLOADS', true);

ファイルタイプによる制限をなくすオプションを有効にします。
この一文を

~ define('ALLOW_UNFILTERED_UPLOADS', true); /* 編集が必要なのはここまでです ! WordPress でブログをお楽しみください。 */ ~

「編集が必要なのはここまでです」の上あたりに挿入します。

手順②「functions.php」の修正

// SVGファイルのアップロードを許可する function my_upload_mimes($mimes) { $mimes['svg'] = 'image/svg+xml'; $mimes['svgz'] = 'image/svg+xml'; return $mimes; } add_action('upload_mimes', 'my_upload_mimes');

「upload_mimes」フックに関数を設定します。アップロード可能なファイルタイプが定義されている配列にsvgを追加します。
これまでは手順①だけでよかったのですが、WordPressのバージョン6.2以降から、両方の対応が必要になったようです。
参考:https://github.com/WordPress/gutenberg/issues/22861

補足:アップロード可能なファイルの種類を制限する

手順①のオプションを有効にすると、svg以外のファイルの制限もなくなってしまうため、セキュリティの観点上あまりよい状態とは言えません。運用上、アップロードするファイルを特定のものに制限してよいのであれば、手順②のコードを下記に置き換えたほうがよいです。

// アップロード可能なファイルを制限する function my_upload_mimes() { $mimes = [ 'jpg|jpeg' => 'image/jpeg', 'png' => 'image/png', 'svg' => 'image/svg+xml', ]; return $mimes; } add_filter('upload_mimes', 'my_upload_mimes');

補足:編集者にもアップロード権限を与える

上記の方法でアップロード可能になるのは管理者権限を持ったユーザーのみとなります。
管理者以外のユーザーにもアップロードできるようにするためには、下記のコードをfunctions.phpに追加します。

// 編集者権限にアップロード権限を設定する function my_admin_init() { $role = get_role('editor'); $role->add_cap('unfiltered_upload'); } add_action('admin_init', 'my_admin_init');

ご質問など受け付けています

記事の中でわかりにくかったところ、もっと知りたかったこと、間違っていることなど、何でもお気軽にご連絡ください。

ご連絡は下記フォームを利用いただくか、ツイッターアカウント@flat8migi宛てでもOKです。