Embeds for Facebook Instant Articles
All Iframely embeds should work fine in Facebook Instant Articles out-of-the-box. There are couple traps that you should avoid though.
How-to: use op-interactive
Please refer to Facebook documentation about
Using Iframely embed codes with Instant Articles is simple:
<figure class=“op-interactive”> <iframe> ... place HTML code you get from Iframely here... </iframe> </figure>
Any HTML code you get from us should work well: our iFrame helpers, cards, or native publisher's "as-is" code.
iFrame tag should not have attributes
Leave iFrame tag in
op-interactive wrapper empty: just
If Facebook sees any attributes in iFrame, it will also request that
height are supplied, and then FB will use those for resizing iFrames dynamically using fixed aspect-ratio, which isn't right for a number of embeds publishers.
Make sure figure is standalone
We saw people having issues with Instant Articles because
<figure> was also wrapped into
<p> element. The
<figure> should stand by itself. Here's what Facebook's documentation says:
The <figure> element representing the embed must be included standalone within the body of the article and not enclosed within a <p> element.
Please let us know if you run into other issues. We'll be debugging with you and updating this manual as required.