How to Allow SVG Upload in WordPress

SVG (Scalable Vector Graphics) files are a popular format for creating and displaying vector-based graphics on the web. By default, WordPress does not allow the upload of SVG files due to security concerns. However, if you need to upload SVG files to your WordPress website, there are a couple of methods you can use to let WordPress allow SVG upload.

Why SVG is Not Allowed in WordPress?

The decision to disallow SVG uploads in WordPress is primarily driven by security concerns; SVG files can contain embedded code, making them potentially vulnerable to malicious attacks. Consequently, by preventing the upload of SVG files, WordPress aims to protect users from potential security risks and ensure the integrity of their websites.

Moreover, SVG files are XML-based; hence, they can contain scripts that execute upon rendering. This poses a significant risk, as malicious code can be injected into SVG files, potentially resulting in unauthorized access, data breaches, or other security issues.

Common Error Messages

Furthermore, if you attempt to upload an SVG file in WordPress, you may encounter an error message such as “Sorry, this file type is not permitted for security reasons.” This message arises due to the default security settings in WordPress, which restrict the upload of SVG files.

WPNotch Banner
WPNotch Mobile Banner

Method 1: Allow SVG Upload in WordPress using a Plugin

To enable SVG support in WordPress and allow the upload of SVG images, you can use the Safe SVG plugin. Safe SVG is a popular SVG support plugin that adds security measures to ensure safe SVG uploads.

Allow SVG Upload in WordPress using a Plugin

Here’s how you can enable SVG support using the Safe SVG plugin:

  1. Install and activate the Safe SVG plugin from the WordPress plugin repository.
  2. Once activated, navigate to the Settings > Safe SVG menu in your WordPress dashboard.
  3. In the Safe SVG settings, you can configure various options related to SVG uploads, including allowed file types, security restrictions, and more.
  4. Customize the settings according to your requirements, ensuring that you maintain a balance between security and functionality.
  5. Save the changes!

Now, you should be able to upload SVG images in WordPress without encountering any error messages.

Method 2: Allow SVG Upload in WordPress using functions.php

Another method to let WordPress allow SVG upload involves adding code snippet to the functions.php file of your WordPress theme (without a plugin). Here’s how you can do it:

  1. Access your WordPress site’s files via FTP or the file manager provided by your hosting provider.
  2. Navigate to the directory of your active WordPress theme.
  3. Locate the functions.php file and open it in a text editor.
  4. Add the following code at the end of the file:

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

Save the changes to the functions.php file and upload it back to your server.

WPNotch Banner
WPNotch Mobile Banner

Method 3: Allow SVG Upload using the Custom Code but in Block Themes

If you are using a block theme, you’ll need to create a new plugin to let allow SVG upload. Follow these steps:

  1. Create an empty folder named “wpnotch-svg-upload” anywhere in your computer (We’ll upload it to the website later).
  2. Inside the “wpnotch-svg-upload” folder, create a new file named “wpnotch-svg-upload.php”.
  3. Open the “wpnotch-svg-upload.php” file in a text editor and add the following code:
<?php
/*
Plugin Name: WPNotch SVG Upload
Description: Allow SVG file upload in WordPress
*/

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

Save the changes to the “wpnotch-svg-upload.php” file.

Once you have created the plugin file, you need to upload it to your WordPress site. Here’s how:

  1. Compress the “wpnotch-svg-upload” folder into a zip file.
  2. Login to your WordPress admin dashboard.
  3. Go to the “Plugins” section and click on “Add New”.
  4. Click on the “Upload Plugin” button at the top of the page.
  5. Select the zip file you created and click on the “Install Now” button.
  6. Click on the “Activate” button to enable it.

Now, you should be allowed to upload SVG files to your WordPress site using either of these methods. Remember to exercise caution when allowing SVG uploads in WordPress, as they can potentially pose security risks if not properly handled.

By following these steps, you can easily let WordPress allow SVG upload in the media library and make use of this versatile file format for your website’s graphics and illustrations.

Response to “How to Allow SVG Upload in WordPress”

  1. […] uploads without a plugin? Dive into manual coding changes! While it requires technical know-how, WPNotch has an amazing blog post with detailed instructions to guide you through the […]

Leave a Reply

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

Discover more from WP Notch

Level up your skills. Get expert tips delivered straight to you. Subscribe!

Continue Reading