Safe SVG

説明

Safe SVG は、WordPress で SVG のアップロードを許可する最良の方法です !

サイトに影響を与える SVG/XML の脆弱性を阻止するためにサニタイズされていることを確認しながら、SVG のアップロードを許可することができます。 また、メディア ライブラリにアップロードした SVG をすべてプレビューすることもできます。

現在の機能

  • サニタイズされた SVG – サニタイズされていないファイルのアップロードを許可して、WordPress サイトにセキュリティ ホールを開かないでください。
  • SVGO 最適化 – SVGをアップロードする際に、SVGO ツールを使用して SVG を圧縮し、容量を節約します。この機能はデフォルトで無効化されていますが、以下のコードを追加することで有効化できます: add_filter( 'safe_svg_optimizer_enabled', '__return_true' );
  • メディア ライブラリで SVG を表示 – どの SVG が正しいかを推測する時代は終わりました。WordPress メディア ライブラリでSVG プレビューを有効にします。
  • アップロードできるユーザーを選択 – SVG のアップロードを WordPress サイトの特定のユーザーに制限するか、誰でもアップロードできるようにします。

最初は #24251 の概念実証です。

SVG のサニタイズは、次のライブラリを通じて行われます: https://github.com/darylldoyle/svg-sanitizer

SVGの最適化は次のライブラリを通じて行われます: https://github.com/svg/svgo

Technical: Upload Path Security

WordPress’s _wp_handle_upload( $file, $action ) function allows any $action value, which determines the filter hook name: {$action}_prefilter. Safe SVG hooks common actions like wp_handle_upload and wp_handle_sideload, but cannot hook arbitrary custom actions defined by third-party code. Since upload actions are unbounded and MIME allowances are global, we cannot guarantee sanitization coverage across all possible upload paths.

ブロック

このプラグインは1個のブロックを提供します。

  • Safe SVG Display the SVG icon

インストール

WordPress ディレクトリからインストールするか、ファイルをダウンロードして解凍し、 /wp-content/plugins/ ディレクトリにアップロードします

FAQ

許可された属性とタグを変更できますか ?

はい、 svg_allowed_attributes および svg_allowed_tags フィルターを使用して行うことができます。
返されなければならない 1 つの引数を取ります。 例については、以下を参照してください:

add_filter( 'svg_allowed_attributes', function ( $attributes ) {

    // Do what you want here...

    // This should return an array so add your attributes to
    // to the $attributes array before returning it. E.G.

    $attributes[] = 'target'; // This would allow the target="" attribute.

    return $attributes;
} );


add_filter( 'svg_allowed_tags', function ( $tags ) {

    // Do what you want here...

    // This should return an array so add your tags to
    // to the $tags array before returning it. E.G.

    $tags[] = 'use'; // This would allow the <use> element.

    return $tags;
} );

Can my theme style an inline SVG?

Mostly, yes. The Inline SVG block renders an SVG that carries its own <style> element inside a shadow root, because CSS inside an inline SVG is otherwise applied to the whole page rather than just the SVG. Stylesheets cannot reach into a shadow root, so theme CSS such as .entry-content svg { fill: red; } will not apply to those SVGs.

Inherited properties still cross the boundary, so setting color on an ancestor and using currentColor inside the SVG works, as do CSS custom properties. SVGs that do not contain a <style> element are rendered without the shadow root and can be styled by theme stylesheets.

To turn isolation off, at the cost of allowing an SVG’s CSS to affect the rest of the page:

add_filter( 'safe_svg_inline_use_shadow_dom', '__return_false' );

Why doesn’t Safe SVG globally enable SVG uploads?

Safe SVG only allows SVGs through upload paths it can actively sanitize. While most WordPress uploads use standard functions like wp_handle_upload() (which Safe SVG hooks), plugins and themes can create custom upload paths by calling WordPress’s underlying _wp_handle_upload() function with arbitrary action parameters.

Globally enabling the image/svg+xml MIME type would allow SVGs through all upload paths—including custom ones Safe SVG cannot intercept and sanitize. This would create security vulnerabilities where unsanitized SVGs containing malicious scripts could be uploaded.

This is a deliberate design decision: Safe SVG prioritizes guaranteed sanitization over broad compatibility. SVGs are only allowed when we can ensure they’re safe.

Where do I report security bugs found in this plugin?

Please report security bugs found in the source code of the Safe SVG plugin through the Patchstack Vulnerability Disclosure  Program. The Patchstack team will assist you with verification, CVE assignment, and notify the developers of this plugin.

評価

2026年3月11日 1 reply
Needed SVG upload support, and this plugin did the job. Very lightweight and easy to use. No issues so far. Some additional settings would be nice, but overall, it's quite solid.
2025年6月21日 1 reply
Would have given a 5 star, but it seems support is missing for the taxonomy / terms section (like in categories) upload for SVG images. Keep getting an error that the upload isn't supported. Hopefully this will be fixed in a future update. Will update once this is added. Cheers!
2025年4月30日 1 reply
Great plugin! very usefull, but please can you add the possibility to add an inline SVG on the block pasting svg code? Thanks!
79件のレビューをすべて表示

貢献者と開発者

Safe SVG はオープンソースソフトウェアです。以下の人々がこのプラグインに貢献しています。

貢献者

“Safe SVG” は30ロケールに翻訳されています。 翻訳者のみなさん、翻訳へのご協力ありがとうございます。

“Safe SVG” をあなたの言語に翻訳しましょう。

開発に興味がありますか ?

コードを閲覧するか、SVN リポジトリをチェックするか、開発ログRSS で購読してみてください。

変更履歴

2.5.0 – 2026-09-07

2.4.0 – 2025-09-22

2.3.3 – 2025-08-13

2.3.2 – 2025-07-21

2.3.1 – 2024-12-05

2.3.0 – 2024-11-25

2.2.6 – 2024-08-28

View historical changelog details here.