In many of the articles imported from my development feed to Facebook Instant Articles I get the error "The HTML element does not contain any text: Avoid including empty HTML elements." It seems to be related to images in figures with no other content. Can anybody tell me what it is Facebook's complaining about? My markup seems to conform to Facebook's own example of a simple image inside a figure tag, so what's the problem?
Turns out the Facebook parser doesn't like a <p>
tag wrapping an element if there's no text in it. When I edit one of the articles highlighted with the yellow warning icon in the Facebook code editor, there's an empty <p></p>
:
When I delete the empty element the error warning remains in the code view. But this is just a glitch in the code editor. You can't always rely on the error highlighting in that. (That explains why there's a code error warning in the pic in my question even though I'd deleted the <p>
.) In the article list the warning icon disappears:
And FB publishes the Instant Article.
You will also get this error if your markup contains stuff like <p><img src="..."></p>
. FB expects all <p>
tags to contain text.