Inline SVG doesn’t works

Hello,

All you have to do is add class="style-svg" to your image tag.
Additionally, you can add loading="eager" as well to make sure the image isn;t natively lazy-loaded by the browser, stopping it being replaced by the inline code.

For example:
<img class="style-svg" loading="eager" src="your-svg-file.svg" />

That will then render your SVG inline if you have the advanced checkbox selected like in your screenshot.

That’s all you need to do ??

Thank you for your fast answer !

Is there a problem if we use wp_get_attachment_image ?

I also tried the specified img and class with the loading but I still have the img tag.

My SVGs are optimised with sketch and SVGOMG.

Even after reupload, still <img src="//localhost:3000/app/uploads/2019/11/computer-1.svg" class="tabs__item-img style-svg" alt="" loading="eager">

• This reply was modified 5 years, 4 months ago by mrglox.
• This reply was modified 5 years, 4 months ago by mrglox.
• This reply was modified 5 years, 4 months ago by mrglox.
• This reply was modified 5 years, 4 months ago by mrglox.

It’s hard for me to tell why your SVG isn’t rendering inline, I would have to look at the site. But it’s likely that there is something preventing it from rendering.

You shouldn’t need the wp_get_attachment_image, that pulls the featured image from a post. You just need to place your image in the post/page and it should render.

I’m using a carbon fields image field in back office with gutenberg block, that’s why I needs wp_get_attachment_image to display it.

Maybe I should try with an other methods or front end or different variable passing…

Do you have any known issues about it ? Don’t found anything about it.

Thanks again !

Oh right… yeah, you’re better off just using a plain code block or something like that. I believe the way you’re doing it would override the functionality of my plugin as it likely changes the frontend code.

See if you can use a plain text or plain code block or something like that to put your IMG tag.

Ok I makes it works with file_get_contents($icon) and had to specify Field::make('image', 'icon', __('Icon'))->set_value_type('url').

Thank you for your help !
Keep the great job ??

Oh wow, that’s definitely a technical way to do it!
But I’m glad you got there ??

Thank you for your support!

i have a similar problem now. Before on most of my installations – the replacement works wonderfull with the custom class (style-svg). But now on a new installation the img tag is shown. Maybe the new WP532 had changed something. All other settings even the theme is on the same version number as before.

Hi @guenni007
Please start your own posts as per forum rules. This one is old and solved and has a number of other users that get notifications when you hijack their threads.

Your issue is likely due to browsers supporting lazy load natively. Please check this recent post about this (as mentioned earlier in this thread as well):
https://www.ads-software.com/support/topic/lazy-loading-fix/

If this isn’t working, you will need to start your own thread so I can help you troubleshoot without bothering everyone else.