How To Use SVGs In WordPress

 — 

Trying to find out how to use an SVG file in WordPress? All you may need is to add a function and filter to your theme’s functions.php file.

Using SVGs In WordPress

To use SVGs in WordPress, you need to add a function and filter to allow this in your WordPress theme’s functions.php file.

  1. Navigate to Appearance > Editor > Theme Functions from your WordPress Dashboard;
  2. Add in the function and filter below into this file and click Update File.
function custom_mime( $mimes ) {
     $mimes['svg'] = 'image/svg+xml';
     return $mimes;
}
add_filter( 'upload_mimes', 'custom_mime' );

Security risks of allowing SVG uploads

Note, it’s important to understand the security risks of someone uploading an SVG through the WordPress media uploader.

Since an SVG is essentially an XML file, it has the ability to contain harmful code, which could potentially infect your entire server.

Therefore, it’s important to consider the risks before enabling SVG support in your theme, as you may also need to restrict further access accordingly.