Enable or upload SVG files in WordPress Media without plugin

By August 30, 2017 Html, WordPress No Comments
Enable or upload SVG files in WordPress Media without plugin

In this post, I’m going to show you how to upload SVG image files in WordPress without using any plugin. By default WordPress doesn’t allow users to upload SVG images or files through WordPress media uploader. If you have tried to upload any SVG file using  default WordPress media uploader, you will surely get error message of rejection. WordPress disable to upload SVG file,  because of some security purpose, but you can safely Enable or upload SVG files in WordPress Media.

What is an Scalable Vector Graphics (SVG) ?

Scalable Vector Graphics (SVG) is an XML-based vector image format for two-dimensional graphics with support for interactivity and animation. The SVG specification is an open standard developed by the World Wide Web Consortium (W3C) since 1999. SVG images and their behaviors are defined in XML text files.

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

SVG Browser Support

1. How to upload SVG image files in WordPress?

As i told every time, WordPress is a true platform for technical and nontechnical user. you Don’t need to install any heavy plugin, for small task/purpose,  It allow many customization and configuration changes through your site theme function.php file.

Here are the steps to go to your theme function.php file.

  1. Go to youe WordPress Dashboard and click on Appearance menu.
  2. Click on the “Editor” and on the right-hand side find Theme functions (functions.php).
  3. Open the functions.php file and paste the following code to the file in the end before the closing of PHP ?> tag.

Here i have shown two code snippets, you can use one of them, both of them working perfectly.

Snippets 1 :

Snippets 2 :

After adding this code snippets  in your functions.php file, click on “Update File” button to save the changes. This will allow you to upload SVG and SVGZ from WordPress Media Uploader.

2. Add SVG Mime Types to .htaccess

Till now you don’t have enables SVG file upload option in server dircotory. To Upload successfully  you need to tell or enable to allow upload request of SVG and SVGZ file.

To this, open your root .htaccess file and add below lines.

Save the file and now  you’re done! You can now upload SVG and SVGZ files in your WordPress site.

 

Now lets discuss why WordPress disable to upload SVG file,  because of security purpose?

So, what is SVG security concern for SVG?, because SVG is wrapped in XML. SVG isn’t the actual problem, XML is the problem for WordPress.

XML has many capabilities and exploitable traits that can allow an hacker to either crash your website with DDoS (Distributed Denial of Service) and DOS (Denial of Service) attacks, or even view open and save files from the server which shouldn’t be accessible, which can hold sensitive information, credentials  and data of your site. This kind of attacks are called XML External Entity Attacks.

Also, Hacker can use SVG file use to execute or run JavaScript, on your server, which should not on your server. XML is structural likely as HTML, can be used to attach and link to external scripts such as JavaScript and Flash, Doing this allows an attacker to use persistent or DOM-based XSS (Cross-Site Scripting) attacks.

 


About Vijay Dhanvai

A passionate blogger by heart and mind, I have been working in this field for 7 years now. A WordPress Professional, web developer and designer who intends to guide his readers about Web Design, WordPress, Blogging, Web Development, and more.

Leave a Reply