Hi, lukecd. Thanks for the feedback.
This more likely than not is related to the markup on your page not being recognized by the transformer that converts your post to valid Instant Articles markup. Some context:
Our plugin makes use of the Facebook Instant Articles SDK for PHP which contains a Transformer that does all the heavy lifting of converting general markup into valid Instant Articles markup. The way that it knows how to transform source elements into the valid Instant Articles markup is by a set of rules which defines the mapping of how to parse the content of the post/page.
Our plugin contains Rules which have been pre-defined to satisfy the most common WordPress source markup. Your content may contain elements which are not covered by the packaged ruleset.
Fortunately, you can override and/or define your own rules in the Settings page of the plugin under: Plugin Configuration > Publishing Settings > Custom transformer rules.
For more information please see the Selector Rules section of our Quick Start guide.
Given this information, let us know if you find a solution. If not, could you provide some more which would help reproduce the issue?
– What’s the debug output shown in the post edit screen on the Facebook Instant Article box (after clicking the “toggle debug information” link)?
– What version of the plugin are you using?
– What version of WordPress are you using?
– What version of PHP are you using (if known)?
Thanks again!
I’m having the same issue with Instagram Embed:
Debug info:
Source Markup:
[Large code excerpt removed by moderator per forum rules. Please use the pastebin for all large code excerpts. It works better anyway.]
Plugin Version: 2.9
Wordpress: 4.4.2
PHP: 5.5
Thread Starter
lukecd
(@lukecd)
Hi
I’ll look at the custom rules, but the HTML I’m using is pretty basic. The example below is just a simple page with a bunch of Instagram embeds and commentary on them. Here’s version and debug info for you. Thanks again for your help on this!
– Luke
WordPress Version 4.4.2
Plugin Version 2.9
PHP Version 5.5.9-1ubuntu4.14
Source URL
https://picnic.ly/2016/04/bandana-style-ideas/
Source Markup
http://pastebin.com/HeNjgaaK
Transformed Markup
http://pastebin.com/weeGSUKn
Hello @lukecd & @itagility.
This particular case has been logged on GitHub and will be supported by the default rules included with the plugin in a future release. I’m marking this thread as “Resolved” for now to avoid duplication. Please follow the progress on this issue here:
https://github.com/Automattic/facebook-instant-articles-wp/issues/234
In the mean time, you can define your own custom rule to support this Instagram Embed as it will not conflict when a new version of the plugin is released to support this case. To assist in defining your own rules, I’m happy to say that we’ve extended our documentation with a section dedicated to giving clarity on the matter, supported by examples.
First and foremost, the main description of this plugin contains a high-level overview of the concept behind Transformer Rules. Additionally, supporting information has been added as FAQs and screenshots.
To go deeper, our main documentation contains examples and reference material for configuring your own Transformer Rules. We hope this would reduce any confusion and the time it takes to get your configuration done.
@lukecd, how did your efforts go with defining your own Rules? Would you be open to assisting the community who have similar issues?
On my side, I was able to fix the issue with the following:
ADDING:
{
“class”: “PassThroughRule”,
“selector”: “center”
},
REMOVING:
{
“class”: “PassThroughRule”,
“selector”: “div”
},
Glad to hear it, @itagility!
Thread Starter
lukecd
(@lukecd)
@paulo … I kinda got lost working on a CustomRule with the old documentation, but will try again now that you’ve updated things. Will report back if I have any luck.
Thanks
