Recently while researching and testing SVG support for a new series of blog articles we discovered a gap in the file types WordPress supports for uploading in it’s Media Library manager, WordPress 3.5 doesn’t support the uploading of SVG files out of the box. This prompted us to find a simple solution to enable SVG upload support

The problem

Drag and Drop or manual file selection via the open dialog returned WordPress upload errors similar to the following:

"logo.svg" has failed to upload due to an errorSorry, this file type is not permitted for security reasons.

The simple solution

The easiest and most flexible solution to the problem is to add a function to your theme’s functions.php file and call it via the upload_mimes hook:

PHP (WordPress)

function custom_mtypes( $m ){
    $m['svg'] = 'image/svg+xml';
    $m['svgz'] = 'image/svg+xml';
    return $m;
add_filter( 'upload_mimes', 'custom_mtypes' );

The above function and filter hook allows both the .svg and .svgz MIME types to the supported uploads in WordPress. Now you can upload either file format, attach the usual metadata for Title, Caption etc… and add SVG media to your posts and pages.

The beauty of this function is that you can add other MIME Types to it to support other unsupported media types.

Even better is that you get thumbnail previews of the .svg files (not .svgz though, at least not on our test server).

We have a comprehensive article on using SVG files on your website and how they can replace many of your existing PNG’s, reduce your bandwidth and speed up page loading times.