Scalable Vector Graphics ("SVG") can be a great way to display line art on your site at a range of sizes without having to worry about file sizes.
They're particularly useful for a logo or for social media icons.
However, due to the way they're coded, uploading an infected SVG can be a potential security risk, which is why WordPress doesn't allow you to upload them by default.
You might see something like this if you try to upload them in the usual way:
The potential security flaw comes from uploading a file from a malicious user, or from allowing a malicious user to upload them.
If you've created the SVG yourself and you're the admin of the site, you should be allowed to easily upload an SVG file.
At the same time, we probably only want to allow admins to upload SVGs.
To allow administrators to upload SVG files to WordPress, add the following code to your function.php file:
add_filter( 'upload_mimes', 'iw_add_svg_mime' );
function iw_add_svg_mime( $mimes ) {
if ( !current_user_can( 'edit_theme_options' ) ) {
return $mimes;
}
$mimes['svg'] = 'image/svg+xml';
return $mimes;
}
This code hooks into the "upload_mimes" filter. If the user isn't an administrator, it just returns the normal list of allowed file types.
Otherwise, the code adds SVG to the allowed file times and returns the list for the uploader to process.
If you're only going to be uploading SVGs during the design process, you might want to add this initially, then remove it when the site goes live.
There's no need to remove it if you're going to continue to use it. It's just best to remove code that's no longer being utilised.
WordPress doesn't stop you using SVGs, it's just trying to protect the unwary user from uploading a bad one.