• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar
NameHero Blog

NameHero Blog

Web Hosting Tips & Resources From NameHero

  • Hosting
    • Web Hosting
    • VPS Hosting
    • WordPress Hosting
    • WooCommerce Hosting
  • Reseller
  • Enterprise
  • Domains
  • Account
  • Blog Home
  • Categories

How To Allow SVG File Uploads In WordPress Media

Bhagwad Park

Published on: January 21, 2019

Categories: WordPress 2

There’s a lot of “wisdom” floating around on the Internet about what kind of image formats to use on your website. PNG or JPG? What size, and resolution? Which compression algorithm? Despite what a lot of articles tell you, there’s no one solution and you need to constantly test to separate myth from fact.

Vector Images vs Regular Images

However, one paradigm stands out – scalability. There are certain images on your site that you use repeatedly. Logos for example. These are used in multiple areas like the header and footer, advertising materials, and on letterheads. These “wide use” images need to be in a format that allows them to expand and contract without losing any of their resolution. They need to be as smooth no matter where you see them, or you risk damaging your brand.

This is why the best practice is to use vector images. Vector images are a special type of image that is defined by mathematical functions instead of pixels. As a result, they can scale up and down infinitely. There’s no “pixilation” when you zoom in –  no matter how high the magnification. By their nature, they are uniquely suited to logos which don’t have a lot of grainy details but are usually more “shape” like.

Plus, the size of vector images is minuscule. Even when you blow it up to thousands of pixels, a vector images just uses up a few KB of space! Whereas normal images can suck up several MB of data.

Vector images are stored in special file formats with the “.svg” extension. So if you’re thinking of placing a logo on your site, try and design it in a vector format as an SVG file so that you’re able to showcase it properly in all the right places.

Problems Uploading Vector Images to WordPress

Ok, you’re convinced that you need a vector image as your logo and you manage to find or design one that will work nicely. Unfortunately, when you try and add an SVG image to the WordPress media library, you get an error like this:

Not Allowed to Upload SVG Images

This because by default, WordPress only allows the following file types as images:

  • jpg
  • gif
  • png
  • bmp
  • tiff
  • x-icon

Any image filetype other than these, and it will give you the message as seen in the screenshot above:

“Sorry, this file type is not permitted for security reasons”

There’s a reason why this is the case since there are reports of “SVG Injection” attacks where hackers can place Javascript into SVG files. If you want to be safe, open the contents of your SVG image in a text editor, and paste it into a tool to sanitize SVG files first!

There’s an ongoing discussion over on the WordPress.org forums over whether or not it should be a default function to allow the uploading of SVG files.

Enabling SVG Uploads

To allow WordPress to upload SVG files, paste the following code into your theme’s functions.php or custom PHP code plugin:

function upload_svg_files( $allowed ) {
    if ( !current_user_can( 'manage_options' ) )
        return $allowed;
    $allowed['svg'] = 'image/svg+xml';
    return $allowed;
}
add_filter( 'upload_mimes', 'upload_svg_files');

If you don’t know how to do this, read this tutorial on pasting custom code into WordPress. Save your changes and you’re done!

Now when you try and upload SVG files into the media library, it works as expected:

Upload of SVG File allowed

It’s a good idea in general to disallow uploading SVG files when it’s no longer needed. You don’t want to give people the ability to freely upload this stuff to your WordPress directory and potentially compromise your website.

So use the above code, upload the file, and then delete it! Best to be safe.

Bhagwad Park Profile Picture
Bhagwad Park

I’m a NameHero team member, and an expert on WordPress and web hosting. I’ve been in this industry since 2008. I’ve also developed apps on Android and have written extensive tutorials on managing Linux servers. You can contact me on my website WP-Tweaks.com!

Reader Interactions

Comments

  1. George says

    April 22, 2020 at 3:21 pm

    Thank you!

    Reply
  2. piyush vekariya says

    April 28, 2020 at 4:41 am

    is not working, wast of time

    Reply

Leave a Reply Cancel reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Primary Sidebar

Follow & Subscribe

Exclusive promos, content and more!

Most Popular Posts

Speed up your site: solving the WordPress slowdown

NameHero’s Recommended WordPress Plugin and Theme Setup (2023)

How To Increase The InnoDB Buffer Pool Size

How To Fix A Stuck All-in-One WP Migration Import

How To Add A Subdomain In Cloudflare

Top Categories

  • WordPress
  • Website Performance
  • Web Hosting
  • Resellers
  • Website Development
  • Website Security
  • VPS Hosting
  • SEO Tips
  • Announcements
  • Domain Registration
NameHero

NameHero proudly provides web hosting to over 40,000 customers with 99.9% uptime to over 750,000 websites.

  • Master Card
  • Visa
  • American Express
  • Discover
  • Paypal
Products
  • Web Hosting
  • VPS Hosting
  • WordPress Hosting
  • WooCommerce Hosting
  • Reseller Hosting
  • Enterprise Hosting
  • Domains
Help & Support
  • NameHero Blog
  • Knowledgebase
  • Announcements
  • Affiliates
Company
  • About Us
  • Contact Sales
  • Reviews
  • Uptime
  • We're Hiring

Copyright © 2023 NameHero, LLC. All rights reserved.

  • Privacy Policy
  • Terms of Use
  • Acceptable Use Policy
  • Payment Policy
  • DMCA