All SVGs on site now broken

Same here. I see that it’s adding width=”1″ and height=”1″ attributes to SVG logos output using the function get_custom_logo.

Deactivating the plugin corrects the issue for now.

I love the plugin so i’m hoping this issue is fixed soon.

Hi there,

I changed the way dimensions are handled which it seems may have had an affect on some sites.

I’m thinking it may be an issue for some where it’s now 1px if no metadata was set during upload.

It’s possible that regeneration of media library could help (backup first). You can do this using WP-CLI really easily.

It hasn’t happened on any of my sites so it’s hard to test. But I’m narrowing in based on a couple of reports.

You can also use some CSS to make sure they’re displayed as normal rather than at 1px.

img[src$='.svg'], svg {
    width: 100%;
}

But I’d love to know if the regeneration works!

Hello,

We had this same issue happen for our sites with the custom logo in the Customizer. The CSS fix definitely works but the root cause is from how the SVG is saved out. If it only has the viewBox attributes attached within the code, then SVG Support just injects the width and height as 1px. Need to make sure to re-upload your SVGs and make sure there’s a height and width set on them. This is done in Illustrator by toggling the Responsive setting off so that it attaches the width and height dimensions. Make sure to delete your logo/SVG files and re-upload them. But the CSS is a quick fix that will save time with saving out SVG files. Oh the joys of SVG and web.

I can possibly make it pull from the viewbox attributes too ??
But for SVGs without a size, I believe having 1px is better than 0px because 0px can cause a division by 0 error.

Does regeneration of media library using WP-CLI have an affect? Would be awesome if someone could try that has this issue.

I’ll be doing some more extensive tests with focus on this myself. But many hands, you know.

WP Media Regenerate via WP-CLI doesn’t work as WP doesn’t recognize the SVGs as media files and it just skips over. Just tested and no changes. CSS fix or re-uploading SVGs with width and height attributes present are only solutions as of now.

I’ve disabled the plugin as I could not get it working.

Thanks for your patience friends!

I’m trying to figure out a way to avoid people needing to do anything when there’s SVGs without dimensions.

I tried putting the CSS into Additional CSS, but it didn’t address the issue. Looking forward to a more robust solution and appreciate your work, @benbodhi!

Heya everyone,
I’m running Stow theme 1.5.15 with SVG Support 2.4.2 and the latest update of SVG Support broke all my SVG images as well.
Any ideas on how to fix that?
If I “Force Inline SVG?” the images show up BUT the Page Covers get resized and misaligned (And I can’t figure out how to change that)
Any help would be welcome!
Thanks

The solves the underlying issue:

/*
 * Correct SVG <img>'s
 *
 * SVG Support is adding a width and height of 1 on all SVG images in
 * the site.
 */
remove_filter('wp_get_attachment_image_src', 'bodhi_svgs_dimension_fallback', 10);

This functions appears to be setting the height and width of SVG images to 1 to “fix for division by zero error for SVGs”. Disabling this solves the issue.

• This reply was modified 2 years, 9 months ago by Kevinleary.net.
• This reply was modified 2 years, 9 months ago by Kevinleary.net.