Animated SVG not animating

Hi there,

Thanks for using my plugin and reaching out to figure this one out ??

So, my plugin can help with why it isn’t animated. This is basically because the SVG code needs to be rendered inline. By default, it will be used like a normal image, inside an IMG tag.

You can add a class to your IMG tag class="style-svg" and my plugin will render it inline so the internal workings function as expected. Please note, the advanced settings need to be checked to allow inlining of SVG files. Settings can be found in your WP dashboard at “Settings > SVG Support”.

However, using it as a background image is not going to work as such, because it is placed in to the CSS using background-image:url("path-to-your-file.svg"); which will not allow it to be rendered inline.

You could potentially hardcode the SVG into your theme template files or something.

Maybe I could offer some solutions if I could see the end result you’re looking for. You can potentially build it out inside the SVG and simply render the SVG inline in a blank page, using the SVG for the whole thing… But yeah, I’d need to know the goal to figure out a good solution.

Happy to help if you can provide more details.

Oh!!! I found this, maybe you can simply paste the SVG code (possibly with minor changes) in the CSS background-image.

Check this out:
https://stackoverflow.com/questions/10768451/inline-svg-in-css

Might have to get creative if using elementor, I’m not super familiar unfortunately, so a bit hard to tell you how to do it in elementor exactly.

But it is totally more possible to achieve than I even thought!

Thanks. I suspect it’s something to do with the svg itself as well, I’ve managed to get other svg files to work just fine as background images. That’s beyond the scope of my abilities though, so I’ve reached out to a couple of people to try to see if they can help with the svg file.

I’ll try the stackoverflow link as well…thanks