Andy Tran

Enable or Upload SVG Image in WordPress Media Without Plugin

by | Aug 26, 2021 | Wordpress

Enable or Upload SVG Image in WordPress Media Without Plugin

What is a Scalable Vector Graphics (SVG) Image?

Scalable Vector Graphics (SVG) is an XML-based vector image format for two-dimensional graphics. It is with support for interactivity and animation. The SVG specification is an open standard developed by the W3c since 1999.

“SVG  enables to resize image or zoom in or zoom out the image without any distortion or blurriness in quality. Image Quality and clarity remain the same if you increase the width or size of an image, while in the case of JGP/JPEG and PNG images, get blurred or pixelated if the size is changed, also almost all modern browser supports the SVG file format. That’s why many users are uploading their website logo and icon in SVG file format.

By default, WordPress does not allow you to enable or upload the SVG image into your WordPress media without the plugin, mainly due to security concerns. By default, WordPress allows you to upload only images (jpg, jpeg, gif, png, etc.), audio and video file formats, but SVG image format is not allowed to use.

To Check Enable or Upload SVG Image in WordPress Media Without Plugin

To check if your SVG support is enabled or not for your WordPress setup simply go to Wp-admin > Media and try to upload SVG type image (Image with extension .svg).
If SVG support is enabled then your image will be uploaded successfully to your WordPress Media
SVG files are still a bit unsafe. That’s why WordPress doesn’t support SVG file uploads by default. If you upload an SVG image in WordPress, then you will see the following error message: Sorry, this file type is not permitted for security reasons.

SVG Image Error

Write the following code in your functions.php file to Enable or Upload SVG Image in WordPress Media.

    • Login to your WordPress Admin Dashboard.
    • Now from the left sidebar go to Appearance -> Theme Editor.
    • Go to the functions.php file and write the below code.

//add SVG to allow file uploads


function add_file_types_to_uploads($file_types){
     $new_filetypes = array();
     $new_filetypes['svg'] = 'image/svg';
     $file_types = array_merge($file_types, $new_filetypes );
     return $file_types; 
} 
add_action('upload_mimes', 'add_file_types_to_uploads');

If the above script does not work for your WordPress website try the following script.


add_filter( 'wp_check_filetype_and_ext', function($data, $file, $filename, $mimes) {

global $wp_version;
if ( $wp_version !== '4.7.1' ) {
return $data;
}

$filetype = wp_check_filetype( $filename, $mimes );

return [
'ext' => $filetype['ext'],
'type' => $filetype['type'],
'proper_filename' => $data['proper_filename']
];

}, 10, 4 );

function cc_mime_types( $mimes ){
$mimes['svg'] = 'image/svg+xml';
return $mimes;
}
add_filter( 'upload_mimes', 'cc_mime_types' );
function fix_svg_support() {
echo '';
}
add_action( 'admin_head', 'fix_svg_support' );

Successfully Enable or Upload SVG Image in WordPress Media Without Plugin

Once you add one of these scripts into your WordPress, you will successfully enable or upload the SVG image in WordPress Media Without plugin.
Now, try uploading an image SVG type and it will get uploaded successfully.

To Continue Learning,
you can refer to our blog post Remove Additional CSS from the WordPress Customizer

0 Comments

Submit a Comment

Your email address will not be published. Required fields are marked *