Invalid or Unexpected Content in Gutenberg Blocks

Table of Contents

Let’s get straight to it.

If you’re working in the block-based WordPress Gutenberg editor, you might have experienced this error after updating and saving changes in a previously used block:

“This block contains unexpected or invalid content”

This issue occurs when the current HTML structure of the block doesn’t correspond with the previously saved version in the block editor. You may not realize that the initial block markup or attributes were modified and you are using the old version of the block.

No panic, that doesn’t mean that the block is broken forever. Let’s briefly outline the most common reasons for this issue and a couple of solutions.

Possible Reasons

The most common reason is that a block author did not properly update their block when trying to improve its capabilities (mismatch between two block versions.)
A block author didn’t properly test a block before release.
You made errors when editing a block of content in the HTML text editor instead of the Gutenberg visual editor.
Global WordPress core updates that somehow influence custom author blocks. Although we believe since WordPress 5.0, there should not be a lot of such issues.

Note: if you don’t need to edit the broken block, you may even leave it as it is – it should render on the frontend properly.

How to Solve This

Notify the block author about the error to figure out whether it’s a common issue and whether they’re doing anything in order to resolve it – and then just wait for an update from them. It is recommended that block authors update block markup, attributes, and features following the best practices of updating deprecated core blocks:

By creating a new block instead of depreciating it.
By providing a deprecated block version and enabling users to edit it in the editor.

Check out the Full Deprecated Gutenberg blocks guide.

2. As the broken block prompts suggest, if “Resolve” doesn’t work, try to convert it to HTML and edit a block code.

3. Recreate a block to be able to use it properly again (most likely, you need to do it on every page where the block is used if you are going to edit it).

If you know other solutions, please share them in the comments!

P.S. Building content in Gutenberg? Download 35+ more custom blocks for free with Getwid! The plugin is a great value to a collection of core Gutenberg blocks for a few reasons: