WordPressでSVGファイルをアップロードできないのは、実はバグや不具合ではありません。WordPressは標準設定で、セキュリティ上の理由からSVGの直接アップロードをブロックしているためです。
そのため、SVGを使うには「アップロードを許可する設定」を自分で追加する必要があります。ただし、SVGにはセキュリティ上のリスクもあるため、やみくもに許可するのは危険です。
この記事では、SVGがアップロードできない原因をエラー別に整理したうえで、安全に使うためのSafe SVGプラグインを使う方法・functions.phpで対応する方法をわかりやすく解説します。リスクを正しく理解したうえで、自分に合った方法を選べるようになります。
目次
【早見表】SVGがアップロードできない原因と対処法の逆引き
まずは、あなたが直面している症状から対処法を逆引きしましょう。下の表で当てはまる行を見つけて、該当セクションへ進んでください。
| エラーメッセージ／症状 | 主な原因 | 解決方法 |
|---|---|---|
| 「セキュリティ上の理由により、このファイルタイプはアップロードできません。」と表示される | WordPressが標準でSVGを許可していない | SVGをアップロードできるようにする3つの解決方法 |
| 「指定されたファイルはアップロードできませんでした。セキュリティ上の理由により、このファイルタイプはサポートされていません。」と表示される | 同上（メッセージの文言はWP/環境により異なる） | 方法1：Safe SVGプラグイン |
| プラグインを使わずに許可したい | テーマ側でファイル形式を追加していない | 方法2：functions.phpにコードを追加 |
| アップロードはできたが、画像が表示されない・崩れる | サニタイズによる属性除去・サーバー設定・コードの不備など | SVGが表示されない・崩れる場合の対処 |
| そもそもSVGを許可して大丈夫か不安 | SVGにはXSSなどのセキュリティリスクがある | アップロード前に知っておくべきセキュリティリスク |
WordPressでSVGをアップロードできないのはなぜ？
結論から言うと、WordPressがSVGのアップロードを標準でブロックしているからです。これは故障ではなく、最初からそう設計されている「仕様」です。まずは理由を正しく理解しておきましょう。
理由：WordPressは標準でSVGを許可していない（セキュリティ上の仕様）
WordPressには、メディアライブラリにアップロードできるファイル形式を制限する仕組みがあります。許可されたファイル形式の一覧（MIMEタイプ）に含まれていない形式は、アップロード時にブロックされます。
JPEG・PNG・GIF・WebP・PDFなどは標準で許可されていますが、SVGはこの一覧に含まれていません。そのため、初期状態のWordPressにSVGをアップロードしようとすると、エラーメッセージが表示されて弾かれます。
WordPressがどのファイル形式を許可するかは、内部の upload_mimes という仕組みで管理されています。後述する方法2は、この仕組みにSVGを追加することで許可する手法です（参考：upload_mimes｜WordPress Developer Resources）。
SVGはバグではなく「意図的にブロック」されている
「設定をいじっていないのにアップロードできない」と不具合を疑う方もいますが、これは正常な動作です。WordPressがSVGを意図的にブロックしているのには、明確な理由があります。
SVGはテキスト（XML）で書かれた画像形式で、ファイル内にJavaScriptなどのコードを埋め込めます。悪意のあるコードを含んだSVGがアップロードされ、表示時に実行されると、サイトを攻撃される危険があるためです。
このリスクの詳細は後半のセキュリティのセクションで解説します。まずは「ブロックは安全のための仕様」と理解しておけば十分です。
それでもSVGを使うメリット（拡大しても劣化しない・軽量）
リスクがあってもSVGが好まれるのは、ほかの画像形式にはない大きなメリットがあるからです。ロゴやアイコン、図版での利用に特に向いています。
- 拡大・縮小しても劣化しない：SVGは点の座標と線で図形を表現する「ベクター形式」のため、どんなサイズで表示しても輪郭がぼやけません。高解像度のディスプレイでもくっきり表示できます。
- ファイルサイズが軽いことが多い：ロゴやアイコンのような単純な図形なら、PNGより軽くなる場合があります。表示速度の面でも有利です。
- CSSで色やサイズを変更しやすい：コードで構成されているため、サイト側で柔軟に扱えます。
こうしたメリットを活かしつつ、リスクを抑えて使うのが理想です。次の章で、具体的な解決方法を見ていきましょう。
SVGをアップロードできるようにする3つの解決方法
SVGを許可する方法は、大きく分けて3つあります。安全性・手軽さの観点から、最初に全体像を比較表で確認しましょう。結論として、ほとんどの方の最適解は「方法1：Safe SVGプラグイン」です。
| 方法 | 推奨度 | 難易度 | 安全性（サニタイズ） | こんな人におすすめ |
|---|---|---|---|---|
| 方法1：Safe SVGプラグイン | ◎ 推奨 | 易しい | あり（自動で無害化） | はじめての方・安全に使いたい方 |
| 方法2：functions.phpに追記 | ○ | やや難しい | なし（自分で対策が必要） | プラグインを増やしたくない方 |
| 方法3：wp-config.phpで全形式を許可 | × 非推奨 | 難しい | なし | 原則おすすめしません |
最大の違いは「サニタイズ（無害化）機能の有無」です。方法1だけが、アップロード時にSVG内の危険なコードを自動で取り除いてくれます。それぞれ詳しく見ていきましょう。
【方法1・推奨】Safe SVGプラグインで対応する
最もおすすめなのが、専用プラグイン「Safe SVG」を使う方法です。SVGのアップロードを許可するだけでなく、危険なコードを自動的に取り除く「サニタイズ機能」を備えているため、初心者でも安全に導入できます。
SVGのアップロードを許可し、ファイル内のスクリプトなど危険な要素を自動で除去（サニタイズ）するWordPress公式ディレクトリ配布の無料プラグインです。有効インストール数は100万以上と実績も豊富です（出典：Safe SVG｜WordPress.org）。
STEP1：プラグインを検索する
WordPress管理画面の左メニューから「プラグイン」→「新規プラグインを追加」をクリックします。右上の検索ボックスに safe svg と入力すると、検索結果に「Safe SVG」が表示されます。
STEP2：インストールする
「Safe SVG」のカード内にある「今すぐインストール」ボタンをクリックします。インストールが完了するまで数秒待ちましょう。
STEP3：有効化する
インストールが終わると、ボタンが「有効化」に変わります。そのまま「有効化」ボタンをクリックしてください。これで設定は完了です。Safe SVGは初期設定のままで動作するため、追加の設定は基本的に不要です。
STEP4：SVGをアップロードして確認する
左メニューの「メディア」→「新しいメディアファイルを追加」を開き、SVGファイルをドラッグ＆ドロップしてみましょう。エラーが出ずにアップロードできれば成功です。アップロードの際、Safe SVGが自動で危険なコードを取り除いてくれます。
本記事の手順は、WordPress 7.0 + Safe SVG v2.4.0 の環境で動作を確認しています（2026年6月時点）。Safe SVG v2.4.0は最終更新が2026年4月14日、対応WordPressバージョンは6.6以上・7.0で動作確認済みと公式に記載されています（出典：Safe SVG｜WordPress.org）。
【方法2】functions.phpにコードを追加する（プラグイン不使用）
プラグインを増やしたくない場合は、テーマの functions.php にコードを追加して、SVGのアップロードを許可する方法もあります。先ほど触れた upload_mimes の仕組みに、SVGを許可形式として追加するアプローチです。
以下のコードを functions.php に追記すると、SVGのアップロードが許可されます。
// SVGのアップロードを許可する
function my_allow_svg_upload( $mimes ) {
$mimes['svg'] = 'image/svg+xml';
return $mimes;
}
add_filter( 'upload_mimes', 'my_allow_svg_upload' );このコードはSVGのアップロードを許可するだけで、ファイル内の危険なコードを取り除く処理（サニタイズ）は行いません。アップロードするSVGは、必ず自分で用意した信頼できるファイルに限定してください。安全性を重視するなら、サニタイズ機能のある方法1（Safe SVG）をおすすめします。
functions.php を親テーマで直接編集すると、テーマを更新したときに変更内容が上書きされて消えてしまいます。子テーマを作成し、子テーマの functions.php に追記してください。また、コードの記述を誤ると画面が真っ白になる（エラーになる）ことがあるため、編集前のバックアップを取っておくと安心です。
【方法3・非推奨】wp-config.phpで全ファイル形式の制限を外す
3つめは、wp-config.php に特定の定数を追加して、ファイル形式の制限そのものを外す方法です。ただし結論として、この方法はセキュリティリスクが高く、一般的なサイトには適しません。原則として使わないでください。
// （非推奨）ファイル形式の制限を外す定数
define( 'ALLOW_UNFILTERED_UPLOADS', true );特定の定数を wp-config.php に追加することで全ファイル形式を許可できますが、SVGだけでなくあらゆる形式のファイルがアップロード可能になってしまうため、セキュリティリスクが高くなります。
この方法は、SVG以外の本来ブロックされるべきファイル形式まで許可してしまいます。とくに複数人で運用するサイトや、フォームからのアップロードを受け付けるサイトでは危険です。SVGを使いたいだけなら、方法1（Safe SVG）で十分です。
SVGをアップロードする前に知っておくべきセキュリティリスク
SVGを許可する前に、なぜWordPressがSVGをブロックしているのか、その「リスクの中身」を理解しておきましょう。リスクを知ったうえで対策すれば、安全にSVGを活用できます。
SVGに潜むXSS（クロスサイトスクリプティング）脆弱性とは
SVGは見た目こそ画像ですが、中身はテキスト（XML）で書かれており、JavaScriptなどのコードを埋め込めます。この性質が、XSS（クロスサイトスクリプティング）と呼ばれる攻撃の入り口になり得ます。
XSSとは、Webページに悪意のあるスクリプトを埋め込み、閲覧者のブラウザ上で実行させる攻撃です。コードを仕込んだSVGがアップロードされ、サイト上で表示・実行されると、Cookieの盗み出しや管理画面の乗っ取りなどにつながる危険があります。
こうしたリスクがあるからこそ、Safe SVGのようなプラグインは「サニタイズ（無害化）」機能を備えています（出典：Safe SVG｜WordPress.org）。
信頼できないSVGをそのままアップロードする危険性
とくに危険なのが、配布元のわからないSVGや、第三者から受け取ったSVGをそのままアップロードするケースです。ファイルの見た目だけでは、中に危険なコードが含まれているかどうかは判断できません。
素材サイトからダウンロードしたSVGであっても、信頼性が不明な場合は注意が必要です。サニタイズを通さずにアップロードすると、気づかないうちに危険なコードをサイトに持ち込んでしまう可能性があります。
安全に使うためのチェックポイント（サニタイズ・配布元の確認）
SVGを安全に使うために、最低限おさえておきたいポイントを整理します。次の3点を守れば、リスクを大きく減らせます。
- サニタイズ機能のある方法を選ぶ：Safe SVGのように、アップロード時に危険なコードを自動で取り除く仕組みを使うのが最も確実です。
- 配布元・作成元が信頼できるファイルだけを使う：自分で作成したSVGや、信頼できる配布元のSVGに限定しましょう。出所不明のファイルは避けます。
- 不要になったら許可設定を戻す：SVGを使う必要がなくなった場合は、プラグインの停止や設定の削除も検討しましょう。
これらを踏まえれば、SVGのメリットを安全に享受できます。とくにこだわりがなければ、サニタイズ機能つきの方法1を選んでおけば安心です。
SVGのアップロード設定やファイル形式の制限は、サーバー環境やPHPの管理しやすさにも左右されます。設定でつまずきやすい部分こそ、扱いやすいサーバーを選んでおくと安心です。
ラッコサーバーは、WordPressの自動インストールやSSL設定が数分で完了し、シンプルで見やすい管理画面からファイルやPHPの管理が行えます。高速Webサーバー「LiteSpeed」採用で表示も快適です。
これからWordPressを始める方も乗り換えを検討中の方も、月額330円（税込）〜で利用でき、30日間の無料お試し期間中にじっくり操作感を確かめられます。
アップロードできたのにSVGが表示されない・崩れる場合の対処
SVGのアップロードには成功したのに、メディアライブラリや投稿画面で「画像が表示されない」「レイアウトが崩れる」というケースもあります。考えられる原因と対処法を整理しました。
- サニタイズで一部の属性が除去された：Safe SVGは安全のため、SVG内の一部のコードや属性を取り除きます。その結果、見た目が変わったり一部が表示されなくなったりすることがあります。元のSVGの作り方を見直すと改善する場合があります。
- SVGに幅・高さの指定がない：SVGファイル自体にサイズ（width / height）の指定がないと、表示サイズが意図せず小さくなったり大きくなったりすることがあります。SVG側でサイズを指定するか、CSSで表示サイズを調整しましょう。
- キャッシュが残っている：キャッシュ系プラグインやブラウザのキャッシュにより、古い表示が残ることがあります。キャッシュを削除し、ブラウザの再読み込み（スーパーリロード）を試してください。
- テーマ・他プラグインとの相性：テーマやほかのプラグインの影響で表示が崩れることもあります。一時的に他プラグインを停止して切り分けると、原因を特定しやすくなります。
なお、SVGに限らずWordPressで画像が表示されない場合は、ファイルのパスやサーバー側の問題が原因のこともあります。詳しくは関連記事「【WordPress】画像がアップロードできない7つの原因と対処法」もあわせて確認してください。
SVGアップロードに関するよくある質問
Q. WordPressでSVGファイルをアップロードできないのはなぜですか？
WordPressが標準設定でSVGのアップロードをブロックしているためです。これは不具合ではなく、セキュリティ上の理由による意図的な仕様です。SVGはファイル内にコードを埋め込めるため、悪用を防ぐ目的で許可形式から除外されています。詳しくは「WordPressでSVGをアップロードできないのはなぜ？」をご覧ください。
Q. プラグインを使わずにSVGをアップロードする方法はありますか？
あります。テーマの functions.php にコードを追加して、SVGの許可形式を追加する方法です。ただしこの方法には危険なコードを取り除くサニタイズ機能がないため、信頼できるSVGファイルのみを扱うことが前提になります。手順は「方法2：functions.phpにコードを追加する」で解説しています。
Q. SVGファイルが表示されない・崩れるのはなぜですか？
主な原因は、サニタイズによる属性の除去、SVG自体にサイズ指定がない、キャッシュが残っている、テーマや他プラグインとの相性などです。まずはキャッシュの削除とブラウザの再読み込みを試すのがおすすめです。詳しい対処法は「アップロードできたのにSVGが表示されない・崩れる場合の対処」で解説しています。
Q. SVGをアップロードできるようにするのは危険ですか？
対策なしに許可するのは危険ですが、正しく対策すれば安全に使えます。SVGにはXSS（クロスサイトスクリプティング）などのリスクがあるため、サニタイズ機能のあるSafe SVGプラグインを使い、信頼できるファイルだけをアップロードすることをおすすめします。詳しくは「アップロードする前に知っておくべきセキュリティリスク」をご覧ください。
Q. SVGファイルを開いたり編集したりするアプリは何ですか？
SVGはWebブラウザ（Chrome・Edge・Safari・Firefoxなど）にドラッグ＆ドロップするだけで表示・確認できます。編集する場合は、Inkscape（無料）やAdobe Illustratorなどのベクター画像編集ソフトが代表的です。SVGはテキスト（XML）形式のため、テキストエディタで中身を開いて確認することもできます。
Q. WordPressのバージョンによって設定方法は変わりますか？
基本的な考え方（標準ではSVGがブロックされる／プラグインやコードで許可する）は、バージョンが変わっても共通です。本記事の手順は WordPress 7.0 + Safe SVG v2.4.0 で動作を確認しています（2026年6月時点）。プラグインを使う方法なら、バージョンの違いを意識せず安全に導入できます。
まとめ：SVGは安全な方法を選んでアップロードしよう
WordPressでSVGをアップロードできないのは、セキュリティ上の理由による意図的な仕様です。許可するには設定の追加が必要ですが、SVGにはXSSなどのリスクがあるため、安全性を意識した方法選びが重要になります。
最後に、本記事のポイントを整理します。
- 原因：WordPressは標準でSVGをブロックしている（バグではなく仕様）。
- 最もおすすめ：サニタイズ機能のあるSafe SVGプラグイン（方法1）。設定不要で安全に使える。
- プラグインを避けたい場合：functions.phpに追記（方法2）。ただし信頼できるファイルに限定する。
- wp-config.phpで全形式を許可する方法（方法3）は非推奨：セキュリティリスクが高く、一般的なサイトには適しません。
- 表示が崩れたら：キャッシュ削除・サイズ指定・他プラグインとの切り分けを試す。
迷ったら、サニタイズ機能つきのSafe SVGを選んでおけば間違いありません。リスクを正しく理解し、安全な方法でSVGを活用しましょう。
