SVG Manager

By default, WordPress blocks SVG file uploads because SVG files can contain JavaScript and other potentially harmful code. NitroShock SVG Manager adds safe SVG support by handling both the upload permission and the automatic sanitization of every uploaded file. Access it from NitroShock → SVG Manager.

Enabling SVG Support

The toggle at the top of the SVG Manager page enables or disables SVG support site-wide. When enabled, SVG files are added to WordPress's allowed MIME types and can be uploaded through both the SVG Manager directly and the standard WordPress Media Library.

Disabling the toggle blocks new SVG uploads but does not remove any existing files.

Uploading SVGs

1. Click Choose File or drag an SVG file onto the upload area.
2. Click Upload.

Each file is sanitized immediately before being saved. The sanitizer removes:

• Inline JavaScript — <script> tags and javascript: attribute values
• Event handler attributes — onclick, onload, onerror, and similar
• External resource references that could load remote scripts or content
• PHP processing tags

All visual content — paths, shapes, filters, gradients, masks, symbols, and standard presentation attributes — is preserved.

Browsing Uploaded SVGs

Uploaded SVGs appear in a grid with a live preview and filename. You can:

• Search by filename using the search field above the grid
• Browse pages using the pagination controls at the bottom
• Delete individual SVGs using the delete icon on each card

Re-Sanitizing All SVGs

Click Re-sanitize All to run every SVG in the library through the sanitizer again. Useful when you have inherited SVG files from another installation or after updating the sanitization configuration.

Using SVGs in Components

Two ways to use an SVG in a component:

• As an image tag — reference the SVG by its URL in a standard <img> tag. This embeds the SVG as an image but CSS cannot target elements inside it.
• Inline SVG — copy the SVG source code from SVG Manager and paste it directly into the component's HTML editor. Inline SVGs can be styled and animated with CSS and are fully accessible to JavaScript.

SVGs in the WordPress Media Library

When SVG support is enabled, SVG files also appear in the standard WordPress Media Library alongside images and are usable anywhere the Media Library is accessible — the classic editor, page templates, and theme files.

Common Questions

Will sanitization visually break my SVG files?

No for typical SVGs. Sanitization removes only potentially harmful elements. All visual content is preserved. If an SVG uses <foreignObject> elements or external resource references, those specific elements will be removed.

Can I upload animated SVGs?

Yes. CSS animations and SMIL (SVG's built-in animation language) are preserved by the sanitizer. JavaScript-based SVG animations are removed — use CSS animations for animated SVGs.

What if I disable SVG support after uploading files?

Existing SVG files remain on disk and in the Media Library. They continue to work on pages where they have already been inserted. New uploads are blocked until support is re-enabled.

Next Steps

• Use SVGs in components — see Component Studio Guide
• Build components with AI — see AI Chat Assistant