New WordPress Gutenberg Editor Breaks Long-form Content

This new editor in WordPress 5.0 is a poor experience for existing sites with many posts of long-form content because it modifies the layout if you try to edit it. That is, posts with over 3000 words that include tables, charts, etc.

Previously in the classic WordPress editor, if I had to edit a typo on one of these pages, I could simply fix a misspelled word, click “Update” and everything else on the page remained unchanged.

Now, in the new WordPress editor (Gutenberg), when I edit a post to fix a misspelled word, and then I click “Update,” the entire appearance/layout of the page changes!

Upon investigation and testing, I see that this happened because the new Gutenberg editor inserted empty paragraph tags in places where the classic editor did not.

The layout was changed because Gutenberg inserted empty paragraph tags within list items and tables, which caused line breaks in unexpected places. I tested and confirmed that the classic editor does not do this in those places (I know that the classic editor will insert paragraph tags where line breaks occur in the editor; this is expected behavior. Gutenberg, however, inserted p tags in unexpected places such as after an unordered list that is nested within a main ordered list, thus creating unwanted line breaks.)

To fix this, I had to go through and manually delete the unwanted p tags. This may be no big deal to fix manually on short posts, but on posts with 6000+ words (my case) this is ridiculous and makes it scary to update an old long-form post.

See more:


Questions and Comments are Welcome

Your email address will not be published. All comments will be moderated.

Please wrap code in "code" bracket tags like this: