‘This block contains unexpected or invalid content’ error when editing HTML

  • Resolved axelblaze88

    (@axelblaze88)


    11 months, 1 week ago

    Hello,

    I’m facing a problem while editing the HTML of certain blocks, such as ‘Advanced Columns’ or ‘Container’ blocks. This issue is significantly impacting my workflow as I rely on automation to generate content, and this particular functionality is crucial for me.

    To illustrate, after inserting an ‘Advanced Columns’ block and opting to ‘Edit as HTML’, I can seamlessly switch back to ‘Edit Visually’ with WordPress displaying the visual blocks correctly.

    The problem arises when I add a simple paragraph to the block and then try to switch back to visual editing. At this point, Gutenberg crashes and displays the error message: “This block contains unexpected or invalid content.”

    Attempts to fix this via ‘Attempt Block Recovery’ have been fruitless, as it only reverts the block to its previous state, without preserving my changes. Similarly, the ‘Resolve’ option in the three-dot menu fails to solve the issue.

    In summary, preserving changes when switching from HTML editing back to visual mode is currently unachievable.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Contributor Ryan Kienstra

    (@ryankienstra)

    11 months, 1 week ago

    Hi @axelblaze88,

    Thanks for your detailed steps to replicate, and for your great screenshots.

    I don’t think there’s a fix for this, unfortunately.

    The block editor generally doesn’t support ‘Edit as HTML’ for blocks with inner blocks.

    Though I should have added supports: { html: false } so ‘Edit as HTML’ didn’t show.

    I tried adding useBlockProps(), and that didn’t help, unfortunately.

    • This reply was modified 11 months, 1 week ago by Ryan Kienstra.
    Plugin Contributor Ryan Kienstra

    (@ryankienstra)

    11 months, 1 week ago

    It sounds like the ‘Code editor’ doesn’t help you, right?

    Thread Starter axelblaze88

    (@axelblaze88)

    11 months, 1 week ago

    Hi Ryan,

    Thanks for your response. It appears we’re dealing with a Gutenberg bug, right? I’ve also noticed that even WordPress’s List block isn’t functioning properly, indicating that the issue isn’t exclusive to Genesis Blocks. I discovered that the initial comment defining the parent block consistently fails to save in the editor. This seems to be what disrupts the Gutenberg UI.

    Interestingly, this comment is visible when inspecting the post directly in the database, as well as in the Code editor, as you mentioned. Therefore, it seems that using the Code editor is the only workaround for now. This is somewhat inconvenient, especially when editing a specific block, due to the lack of visual reference for other blocks. Additionally, the absence of color syntax highlighting in the editor means having to copy the content to an IDE and then back again. For the time being, I’ll use this solution and hope the WordPress team addresses this issue soon. Thanks for your time.

    Plugin Contributor Ryan Kienstra

    (@ryankienstra)

    11 months, 1 week ago

    Hi @axelblaze88,

    Thanks, would it be alright if I disabled the ‘Edit as HTML’ button, so at least this error wouldn’t happen?

    Of course, that doesn’t help you. Sorry I couldn’t fix this.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘‘This block contains unexpected or invalid content’ error when editing HTML’ is closed to new replies.