Inline SVG Image in Gutenberg

  • Resolved John Brand

    (@brandbrilliance)


    4 years, 9 months ago

    Since Gutenberg, the image block wraps the image in a figure tag and the class you add to the block gets applied to the figure tag and not on the IMG tag. Therefore your inline SVG doesn’t seem to work.

    Would it be possible to change the way it scrubs for the style class, to be either on the img tag directly OR the surrounding figure tag.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Benbodhi

    (@benbodhi)

    Hi there,

    I’m looking at implementing something to deal with this sort of thing. You come across it when using visual builders as well, because they wrap image elements differently and don’t add the class to the actual IMG tag. Problem is, there is multi levels up to look at for a few cases.

    I’ll be ding some more work on the plugin soon. I will possibly be making a custom block for SVG with some options in it. That would be the most intuitive I think.

    But regardless of these decisions, the issue you’re facing will be addressed in some way or another ??

    In the meantime, you can just use a code block or the HTML and just put your IMG tag in that.

    Plugin Author Benbodhi

    (@benbodhi)

    I’ll mark this as resolved since there is a workaround and this feature is on the list of to do’s (hopefully I can roll it in to one of the next updates).

    +1 for this feature. Gutenberg is now part of WordPress core and more and more people are starting to use it instead of the classic editor or third party visual editors, so Gutenberg should be supported.

    Using an HTML block isn’t a great workaround as it doesn’t visually show the image in the editor to the user, which defeats the purpose of using Gutenberg.

    Also, the “Automatically insert class?” option is not working with Gutenberg either.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Inline SVG Image in Gutenberg’ is closed to new replies.

Tags