One of my clients wanted to use/upload SVG images (example.svg) on the WordPress media library. But you might already have known that if you upload any image in SVG format on WP media library, then WordPress will directly reject that for security reasons and will show an error “Sorry, this file type is not permitted for security reasons.”

To solve this issue, you might be thinking of using a plugin that supports SVG images. However, instead of using a plugin, you can solve this issue just writing a little bit of code on your functions.php file

Just copy the below code and paste it into your functions.php file and you will get the required results!

function cdxn_mime_types($mimes) {
    $mimes['svg'] = 'image/svg+xml';
    return $mimes;
}
add_filter('upload_mimes', 'cdxn_mime_types');

Though the SVG images will now work fine if you want to show the thumbnail on the dashboard media library (List view), put the below code on your functions.php

function cdxn_fix_svg_thumb_display() {
    echo '
    <style type="text/css">
        table.media .column-title .media-icon img[src$=".svg"] {
        width: 100% !important; 
        height: auto !important; 
        }
    </style>
    ';
}
add_action('admin_head', 'cdxn_fix_svg_thumb_display');

Notes: If you add SVG image using WP post Editor, then the width and height of that image will be shown as “1”. So don’t forget to assign a width and height manually in order to properly show them on the front end.

We hope this tutorial was helpful and easy for you. If you would like to read some more tutorials, you are welcome to visit our WordPress blog page.

Let us know if you have any additional queries! Thanks.