Are you having problems uploading SVG files to WordPress? Don't worry, this is a common problem because WordPress does not support SVG by default. If you want to solve the problem, sit down and continue reading this article! We will show you what SVG is and how to upload SVG files to WordPress using plugins!
What are SVG files?
SVG (Scalable Vector Graphics) is an XML text-based vector image format. Popular image formats like JPG and PNG are made up of tons of tiny squares called pixels, but the SVG file format relies on XML markup to describe lines, shapes, and other image attributes.
SVG files weren't popular until recently, even though they've been around since the 90s. A W3Techs statistic shows that as of April 2019, only 16.7% of all websites use SVG. But this number could grow as developers and website owners strive to meet current needs for scalability and fast loading speeds (we'll explain why later).
The other great thing about SVG is that it has wide support and works well on all major browsers like Chrome, Firefox, Safari, and Chrome for Android!
Unfortunately, users of IE8 or earlier versions of Chrome and Safari may experience problems as those browsers do not support this format. But that's not a problem for webmasters, as most people no longer use these browsers (they don't rank in the top 15 browsers in the world).
Why should SVG files be more popular?
A lot of people are still new to the SVG image format because it's not set up like pixel graphics. But this should not happen because this graphic format has a lot of benefits.
The first outstanding advantage of SVG is its extensibility. Since SVG images are vector-based, they stay the same quality across all screen resolutions.
If the JPG file is blurry on specific devices because it's not large enough, the SVG file will still look perfect. You can zoom in and out as much as you want without losing quality. This particular feature is really helpful when it comes to providing a high-quality user experience for all website visitors.
It is known that SVG images have a small file size, so they take up less web memory space and load faster than raster images. But interestingly – if you take an image with enough detail and convert it to an SVG image, it will take up more space than either JPG or PNG combined.
Why so? This is because the SVG file size depends on the complexity of the image. The more detailed the image, the larger the file size. That's why SVG files are better suited for logos and icons. If you want to feature highly detailed images – like photos – on a web page, JPG and PNG are still the way to go.
Another great feature for webmasters is that Google indexes SVG files. All images in this format will show up in Google Image Search, giving your website a significant SEO boost.
SVG is not part of WordPress Core
With so many advantages, why aren't SVG files more popular? Why doesn't WordPress allow easy SVG file uploads?
The main reason why WordPress does not include SVG files as core (default files) is because of the security risks it poses.
SVG images are basically text files, anyone can easily exploit them by inserting malicious code. As a result, the website is exposed to attacks, which can lead to serious hacking. Scary isn't it?
That's why you need to be careful when handling SVG files. If you want to upload this file to WordPress, it's important that you do it the right way – especially if you want to upload free files that you obtained from unknown sources.
The solution to prevent unwanted code is to Sanitize SVG files. This process removes suspicious code and errors, keeping images safe for the site. Accidentally uploading SVG images to WordPress can lead to serious consequences (such as a hacked website and a server crash).
There is still a lot of discussion going on about making SVG images a core WordPress feature. But since this has not been achieved, until then we have to get creative and get help from other sources when uploading SVG files to WordPress.
How to upload SVG files to WordPress (processed)
The best safe way to upload SVG files to WordPress is to use Safe SVG – a plugin that automatically scans uploaded SVG files by removing security errors. In addition, it previews SVG files in the media library so you can add them to your posts easily.
This WordPress plugin has a pro version that allows limited users to upload SVG files. This feature is useful for a multi-contributor site because you can limit access to people you trust.
The pro version includes an SVGO Optimization server – which allows you to reduce file sizes and premium support instead of forum support.
You can get this plugin from the WordPress repository or from the admin dashboard.
When installing and activating the plugin, there is no need to adjust the settings. It simply allows SVG files to be uploaded, while automatically scanning them.
Here's an example, where we tried to upload an SVG image before installing Safe SVG. As you can see, WordPress doesn't allow it due to security issues.
But after installing Safe SVG, we can upload it easily. And can even preview images instead of file icons (which is the case if you use many other SVG plugins).
Summary
Obviously, SVG images have many advantages for a WordPress site. However, due to the text format, people insert injection code and leave the site vulnerable. This is the main reason why WordPress does not allow users to upload SVG by default.
The reason is that if you want to upload SVG images to WordPress, you have to use some support from SVG Safe – WordPress plugin. It allows you to upload SVG files and remove all the malicious code at the same time so that the file is not hacked.
For the safety of using plugin support, we encourage you to be careful at all times. If you want to download any SVG images for free, check that they are from a trusted source. Wish you safe!
