How to use SVGs in WordPress

SVG (Scalable Vector Graphics) is an XML-based vector image format. SVG has several potential benefits over other graphics formats like JPG or PNG.

Firstly there's a clue in the name - SVGs are scalable - they can be resized when viewed with no loss in quality or pixelation like you might get with a JPG or PNG.

Further, you'll often find that for logos and simple graphics SVG images can be smaller in file size too - which means your website will load quicker - double win!

WordPress doesn't support SVG format images out of the box. But fortunately, there's a third-party plugin Safe-SVG (external link opens in a new window) that can help us out.

You'll need to be logged in to WordPress as an Administrator, or have sufficient privileges to be able to install a plugin.

  1. From the WordPress dashboard, select Plugins > Add New or from the Plugins screen click the Add New button.
  2. Start typing safe SVG into the search box and the correct plugin should show up in the results.
    Click the Install Now button.
  3. Once the plugin has installed click the Activate button.
  4. No further configuration is required - you'll now be able to upload and work with SVG files through the WordPress Media Library.

How did we do?

Powered by HelpDocs (opens in a new tab)
© Krystal Hosting Ltd 2002–