classic block bug – "This block contains unexpected or invalid content"

• 

  thesupercargo · Member · Aug 4, 2019 at 10:56 am

  • Copy link
  • Add topic to favorites

  Hi!

  I am rebuilding my website on a localhost and trying to learn to use Gutenberg while I do so. I can see there are some very positive things about Gutenberg, but one thing I cannot manage to make it do is to wrap text around a thumbnail as I could in the Classic version of WordPress.

  I thought the Classic block was the answer to my problems when I found it, but it isn’t. There is some sort of a bug in it that causes it to fail on the back end. (But only on the back end, I think.)

  This is what I did. I created a two column block and added one Classic block to each column. In each Classic block I put a thumbnail image and a wrap around text. The image and text in one block links to another page or a post on my site. (The image behaves as a button.) It all looked good, both in the visual editor and the preview, so I saved it.

  The following day when I returned to edit some more, instead of seeing the contents of the classic block I see two error messages (one for each Classic block): “This block contains unexpected or invalid content”.

  I’m given the option to Resolve or Convert to HTML. Clicking on the Convert to HTML button does nothing. The button is dead.

  Clicking on the Resolve button calls up a Resolve Block pop-up. This show the HTML of the block to the right (called Current) and the same HTML to the left with one or two characters highlighted in red and some new text added and highlighted in green. This is called After Conversion.

  Specifically, it seems to be telling me to remove a <p> and a </p> tag and insert a <figure> and </figure> tag around the image.

  The two buttons at the bottom of the Resolve Block – Convert to HTML and Convert to Block – are dead. They do not work.

  Instead I open the same page in a second tab in my browser, view it in the Code Editor and make what I suppose are the recommended changes there. I save it and switch back to the Visual Editor. But I’m still only seeing “This block contains unexpected or invalid content”.

  Clicking on the Resolve button now shows the HTML on both sides of the Resolve Block (Current and After Conversion) to be identical, but <figure> and </figure> in the After Conversion are highlighted in green.

  HOWEVER, the page Preview appears to show the images and text on the front end looking and behaving as I want them to.

  Two things to be said:
  1) This seems to be a very complex way of correcting an error which I think Gutenberg has itself introduced. The dead buttons and the need to open the Code Editor in a separate tab suggest to me there’s a serious flaw in this block. I see plenty of other people have been having similar problems (but not the same problem). I’ve not been able to find a solution other than the one I describe above. I hope some one is working on this.
  2) Can I trust that the code will work on the front end (once corrected) even if it doesn’t on the back end?

  Thanks for reading this. Any advice – especially in response to my second question – gratefully received.

  John

  I am using the latest version of WordPress: 5.2.2 with the latest version of the basic Generate Press 2.3.2 (Child theme)

• 

  thesupercargo · Member · Aug 4, 2019 at 11:02 am

  • Copy link

  *In the Resolve Block pop-up the Current HTML is to the left and the After Conversion to the right. Of course.

  Don’t ever trust me to give you directions while you’re driving!
  :-)

• 

  thesupercargo · Member · Aug 4, 2019 at 4:23 pm

  • Copy link

  I’m sorry.

  This was intended for the WP.org forums. It’s just so bloody difficult to find the topic input form over there. I Googled “how to start a topic in word press support forum”. Google brought me here and I didn’t realise till just now.

  If I could I’d delete this thread, perhaps a moderator can do that?

  Don’t just mark it resolved though, because it isn’t.