SafeSVG breaks Avada

Hi @kbi_user,

I’m sorry to hear you’re having issues with SafeSVG and Avada. I’ve reached out to ThemeFusion about this and hopefully, we can work together to find a fix for you. I’ll keep you updated!

@daryll

Wow I didnt expect ya that fast ??

Sohaib from Avada support just figured that issue out.

Hi @kbi_user,

I’ve now spoken to Mark @ Theme Fusion, he’s tested Safe SVG with Avada and found no compatibility issues. He did mention that there’s a minor adjustment rolling out in the next version that will make the height/width work a bit better but other than that all was OK.

I’m sorry I can’t be more help with this issue. Do you have many more plugins that are running on the site? It’s possible that one of the others may be conflicting.

Since we found a compatibility issue, I assume it’s up to the definition of the wording “no compatibility issue”. For now we have to disable your plugin after upload of SVGs.

To my mind that’s a compatibility issue.

See: https://www.xspera.com

That’s how it looks, when SafeSVG is turned on:
https://www.xspera.com/wp-content/uploads/2019/07/Unbenannt.jpg

Hi @kbi_user,

I haven’t tested the two together personally, this is coming from Theme Forest’s team.

From what I can see in your screenshot, the image’s aren’t showing at your desired size when Safe SVG is turned on? The only thing that could be causing this is that Safe SVG will read the size of the image in this function and output the height/width in the image tag. This stops issues with themes not having SVG support and therefore SVGs having a width of 0px and essentially not appearing.

Ultimately, this inline width will be being pulled from the uploaded SVG files so in my eyes, the options would be:

1. Update the SVGs to have the correct image sizes/viewbox as it should be on the site.
2. Overwrite the inline styles using CSS and set the styles that way to appear back to the desired size.

Unfortunately, as this is ultimately an issue with a specific theme, I can’t justify removing the code from Safe SVG, as others are relying on it. Therefore, I’m closing this issue and would suggest that you either try one of the above solutions or reach out to the Theme Forest support team and ask them to help you find a solution.

Cheers,
Daryll

You can check the images on the main page. Size is 300x200px. Without Safe SVG, Avada applies the correct image sizes. With Safe SVG turned on, the updated height and width attributes (updated by Avada) are not applied. Instead the default height entry is used (35px), while the width enty is correct.

Bottom line: With SafeSVG active, the wrong value for height is used. Maybe just an issue with lazy loading?

While looking at it, it applies especially to that element: Content Boxes

So it seems its an Avada issue, if you are sure you are correct ??

PS: I checked it was all other plugins off; only SafeSVG and Avada active.

Hi @kbi_user,

You may be correct, lazyloading may be the issue here, but I can’t be 100% on that.

Ultimately Safe SVG will try and attempt to pull the width and height from the SVG content or viewbox. If it can’t do this, it’ll fall back to 1px, which it’s not doing.

I definitely would suggest reaching out to Theme Fusion as it does seem to be something that’s happening that side and I’ll also try and get back in touch/test it my end to see if I can see any issues.