facebook / instant-articles-builder Goto Github PK
View Code? Open in Web Editor NEWInstant Articles Rules Editor
Home Page: https://facebook.github.io/instant-articles-builder
License: Other
Instant Articles Rules Editor
Home Page: https://facebook.github.io/instant-articles-builder
License: Other
VERSION: 0.2.0
URL: https://geek-developer.com/comment-installer-et-utiliser-ckeditor-dans-laravel-6/
RULES:
{
"generator_name": "facebook-instant-articles-builder",
"generator_version": "0.2.0",
"rules": [
{
"class": "TextNodeRule"
},
{
"class": "GlobalRule",
"selector": "html",
"properties": {
"article.title": {
"attribute": "content",
"selector": "p:nth-child(4)",
"type": "element"
},
"article.publish": {
"format": "Y-m-d\\TH:i:sP",
"selector": ".heading-content-date",
"type": "date"
},
"author.name": {
"selector": ".heading-content a",
"type": "string"
},
"image.url": {
"attribute": "src",
"selector": ".img-fluid",
"type": "string"
},
"article.body": {
"attribute": "content",
"selector": ".col-lg-8",
"type": "element"
},
"article.canonical": {
"attribute": "href",
"selector": "p:nth-child(5)",
"type": "string"
}
}
},
{
"class": "BlockquoteRule",
"selector": "blockquote"
},
{
"class": "ParagraphRule",
"selector": "p"
},
{
"class": "H2Rule",
"selector": "h2"
},
{
"class": "H1Rule",
"selector": "h1"
},
{
"class": "ListElementRule",
"selector": "ol, ul"
},
{
"class": "ListItemRule",
"selector": "li"
},
{
"class": "AnchorRule",
"selector": "a",
"properties": {
"anchor.href": {
"attribute": "href",
"selector": "a",
"type": "string"
}
}
},
{
"class": "ItalicRule",
"selector": "i"
},
{
"class": "EmphasizedRule",
"selector": "em"
},
{
"class": "BoldRule",
"selector": "b, strong"
},
{
"class": "ImageRule",
"selector": "img",
"properties": {
"image.url": {
"attribute": "src",
"selector": "img",
"type": "string"
},
"image.caption": {
"attribute": "src",
"selector": "img",
"type": "element"
}
}
}
]
}
It'd be nice to display somewhere the warnings (if any) that the IA SDK returns. This could help to identify why some elements may be missing or not being transformed correctly.
19. února 2019 ● 14:44
strftime
but not date
VERSION: 0.2.0
URL: https://www.blesk.cz/clanek/celebrity-ceske-celebrity/596207/zarostly-repka-u-soudu-podminky-mu-zmenili-na-9-mesicu-natvrdo.html
RULES:
{
"generator_name": "facebook-instant-articles-builder",
"generator_version": "0.2.0",
"rules": [
{
"class": "TextNodeRule"
},
{
"class": "GlobalRule",
"selector": "html",
"properties": {
"article.title": {
"attribute": "content",
"selector": "h1",
"type": "element"
},
"article.publish": {
"format": "d. F Y ● G:i",
"selector": ".dateTime",
"type": "date"
},
"author.name": {
"selector": ".author",
"type": "string"
},
"image.url": {
"attribute": "src",
"selector": ".gallery-main-container .gallery",
"type": "string"
},
"article.body": {
"attribute": "content",
"selector": "#bbtext",
"type": "element"
},
"article.canonical": {
"attribute": "href",
"selector": "link[rel=canonical]",
"type": "string"
}
}
},
{
"class": "BlockquoteRule",
"selector": "blockquote"
},
{
"class": "ParagraphRule",
"selector": "p"
},
{
"class": "H2Rule",
"selector": "h2"
},
{
"class": "H1Rule",
"selector": "h1"
},
{
"class": "ListElementRule",
"selector": "ol, ul"
},
{
"class": "ListItemRule",
"selector": "li"
},
{
"class": "AnchorRule",
"selector": "a",
"properties": {
"anchor.href": {
"attribute": "href",
"selector": "a",
"type": "string"
}
}
},
{
"class": "ItalicRule",
"selector": "i"
},
{
"class": "EmphasizedRule",
"selector": "em"
},
{
"class": "BoldRule",
"selector": "b, strong"
},
{
"class": "ImageRule",
"selector": "img",
"properties": {
"image.url": {
"attribute": "src",
"selector": "img",
"type": "string"
},
"image.caption": {
"attribute": "src",
"selector": "img",
"type": "element"
}
}
}
]
}
I think instead of telling the user to update their node version we should add a badge that tells the user what the lowest supported version of node is and also specified that version in the engines
property in package.json
.
Thoughts?
I have more than three weeks to claim the domain and I still have pending what does not let me load the instant articles to send the request for the instant items, please help me with this case
![pending] (https://user-images.githubusercontent.com/40700432/42420078-3567da92-8275-11e8-841e-8eb4901db250.png)
I need to set the width and height of my ad, but this does not is working, only 'ad.rule' works.
I've also tried using 'constant' and 'value', but it did not work.
{
"style_name": "uol",
"rules": [
{
"class": "TextNodeRule"
},
{
"class": "GlobalRule",
"selector": "html",
"properties": {
"article.title": {
"attribute": "content",
"selector": "span i",
"type": "element"
},
"article.publish": {
"format": "Y-m-d\\TH:i:s",
"selector": "[ia-date]",
"type": "date"
},
"author.name": {
"selector": "[ia-author]",
"type": "string"
},
"image.url": {
"attribute": "content",
"selector": "[property=\"og:image\"]",
"type": "string"
},
"article.body": {
"selector": "article.article .text",
"type": "element"
},
"article.canonical": {
"attribute": "href",
"selector": "link[rel=canonical]",
"type": "string"
}
}
},
{
"class": "BlockquoteRule",
"selector": "cite"
},
{
"class": "ParagraphRule",
"selector": "p"
},
{
"class": "H2Rule",
"selector": "h2,h3"
},
{
"class": "H1Rule",
"selector": "h1"
},
{
"class": "ListElementRule",
"selector": "ol, ul"
},
{
"class": "ListItemRule",
"selector": "li"
},
{
"class": "AnchorRule",
"selector": "a",
"properties": {
"anchor.href": {
"attribute": "href",
"selector": "a",
"type": "string"
}
}
},
{
"class": "ItalicRule",
"selector": "i"
},
{
"class": "EmphasizedRule",
"selector": "em"
},
{
"class": "BoldRule",
"selector": "b, strong"
},
{
"class": "ImageRule",
"selector": "img",
"properties": {
"image.url": {
"attribute": "src",
"selector": "img",
"type": "string"
},
"image.caption": {
"attribute": "src",
"selector": "img",
"type": "element"
}
}
},
{
"class": "FooterRule",
"selector": ".thumbnail-standard"
},
{
"class": "VideoRule",
"selector": "article.article .video-embed",
"properties": {
"video.url": {
"attribute": "data-ia-url",
"selector": ".uolplayer",
"type": "string"
},
"video.type": {
"attribute": "data-ia-type",
"selector": ".uolplayer",
"type": "string"
}
}
},
{
"class": "PassThroughRule",
"selector": ".summary-content,.summary-news,.slot-g,.text,.youtube-embed,.related-content-hyperlink"
},
{
"class": "AdRule",
"selector": "[ia-ad-url]",
"properties": {
"ad.url": {
"attribute": "ia-ad-url",
"selector": "[ia-ad-url]",
"type": "string"
},
"ad.width": {
"attribute": "ia-ad-width",
"selector": "[ia-ad-width]",
"type": "int"
},
"ad.height": {
"attribute": "ia-ad-height",
"selector": "[ia-ad-height]",
"type": "int"
}
}
}
]
}
VERSION: 0.2.0
URL: https://www.cbtisrael.co.il/2018/05/29/%D7%94%D7%A4%D7%A8%D7%A2%D7%AA-%D7%90%D7%9B%D7%99%D7%9C%D7%94-%D7%9E%D7%9E%D7%94-%D7%A0%D7%95%D7%91%D7%A2%D7%AA-%D7%90%D7%9B%D7%99%D7%9C%D7%94-%D7%A8%D7%92%D7%A9%D7%99%D7%AA/
RULES:
{
"generator_name": "facebook-instant-articles-builder",
"generator_version": "0.2.0",
"rules": [
{
"class": "TextNodeRule"
},
{
"class": "BlockquoteRule",
"selector": "blockquote"
},
{
"class": "ParagraphRule",
"selector": "p"
},
{
"class": "H2Rule",
"selector": "h2"
},
{
"class": "H1Rule",
"selector": "h1"
},
{
"class": "ListElementRule",
"selector": "ol, ul"
},
{
"class": "ListItemRule",
"selector": "li"
},
{
"class": "AnchorRule",
"selector": "a",
"properties": {
"anchor.href": {
"attribute": "href",
"selector": "a",
"type": "string"
}
}
},
{
"class": "ItalicRule",
"selector": "i"
},
{
"class": "EmphasizedRule",
"selector": "em"
},
{
"class": "BoldRule",
"selector": "b, strong"
},
{
"class": "ImageRule",
"selector": "img",
"properties": {
"image.url": {
"attribute": "src",
"selector": "img",
"type": "string"
},
"image.caption": {
"attribute": "src",
"selector": "img",
"type": "element"
}
}
}
]
}
VERSION: 0.2.2
URL: https://engineering.fb.com/2017/09/26/web/react-16-a-look-inside-an-api-compatible-rewrite-of-our-frontend-ui-library/
RULES:
{
"generator_name": "facebook-instant-articles-builder",
"generator_version": "0.2.2",
"rules": [
{
"class": "TextNodeRule"
},
{
"class": "GlobalRule",
"selector": "html",
"properties": {
"article.title": {
"attribute": "content",
"selector": ".entry-title div",
"type": "element"
},
"article.publish": {
"attribute": "datetime",
"format": "Y-m-d\\TH:i:sP",
"selector": ".entry-meta .entry-date",
"type": "date"
},
"author.name": {
"selector": ".entry-authors-social .author",
"type": "string"
},
"image.url": {
"attribute": "srcset",
"selector": "#post-feat-image-container .wp-post-image",
"type": "string"
},
"article.body": {
"attribute": "content",
"selector": ".entry-content",
"type": "element"
},
"article.canonical": {
"attribute": "href",
"selector": "link[rel=canonical]",
"type": "string"
}
}
}
]
}
I'm trying to get video from the website. I saw it create a placeholder, but it does not show the video. so it just leaves a placeholder to show the place only not showing the real video content.
My question is, is that feature or bug? If the expected can show the video, then any suggestions on how to show that video?
Typo in Line 139: displayName: 'HRef',
I think 'R' should be small displayName: 'Href',
If a user clicks to find an element but then clicks outside the Browser we should cancel the search.
VERSION: 0.2.0
URL: https://heliopolist.com/12-hotels-in-heliopolis-for-the-perfect-wedding/
RULES:
{
"style_name": "Heliopolist",
"generator_name": "facebook-instant-articles-builder",
"generator_version": "0.2.0",
"rules": [
{
"class": "TextNodeRule"
},
{
"class": "GlobalRule",
"selector": "body",
"properties": {
"article.title": {
"attribute": "content",
"selector": ".jv-single-post-title",
"type": "element"
},
"author.name": {
"selector": ".meta-author-name a",
"type": "string"
},
"article.body": {
"attribute": "content",
"selector": ".entry-content",
"type": "element"
},
"article.canonical": {
"attribute": "href",
"selector": ".jv-single-post-title",
"type": "string"
}
}
},
{
"class": "BlockquoteRule",
"selector": "p"
},
{
"class": "ParagraphRule",
"selector": "p"
},
{
"class": "H2Rule",
"selector": "strong"
},
{
"class": "H1Rule",
"selector": "strong"
},
{
"class": "ListElementRule",
"selector": "p"
},
{
"class": "ListItemRule",
"selector": "body"
},
{
"class": "AnchorRule",
"selector": "strong",
"properties": {
"anchor.href": {
"attribute": "href",
"selector": "strong",
"type": "string"
}
}
},
{
"class": "ItalicRule",
"selector": "strong"
},
{
"class": "EmphasizedRule",
"selector": "#page-style"
},
{
"class": "BoldRule",
"selector": "strong"
},
{
"class": "ImageRule",
"selector": "p",
"properties": {
"image.url": {
"attribute": "src",
"selector": "img",
"type": "string"
},
"image.caption": {
"attribute": "src",
"selector": ".size-medium",
"type": "element"
}
}
}
]
}
I really really really want this method to work, it was so simple and intuitive to set up. WAY better than the RSS or API methods. But it seems that FB is simply not ingesting the articles.
I have included the appropriate fb:pages and ia:rules_url to the article pages, tried sharing articles, but alas can not get any to register as Instant articles.
Documentation is lacking around the web for the ia:rules_url method. Are there steps I'm missing? Does this method for sure work? Any help would be greatly appreciated.
2019-09-29T09:25:52.317Z
I tried to put various formats, all to no avail
config.json
{
"generator_name":"facebook-instant-articles-builder",
"generator_version":"0.2.0",
"rules":[
{
"class":"TextNodeRule"
},
{
"class":"GlobalRule",
"selector":"html",
"properties":{
"article.title":{
"attribute":"content",
"selector":".css-1qtfblh-SInfoName",
"type":"element"
},
"article.publish":{
"attribute":"datetime",
"format":"D, j M Y H:i:s O",
"selector":".CrearedAt",
"type":"date"
},
"author.name":{
"attribute":"content",
"selector":"meta[name=\"author\"]",
"type":"string"
},
"image.url":{
"attribute":"content",
"selector":"meta[property=\"og:image\"]",
"type":"string"
},
"article.body":{
"selector":".SContentEditor",
"type":"element"
},
"article.canonical":{
"attribute":"content",
"selector":"meta[property=\"og:url\"]",
"type":"string"
}
}
},
{
"class":"BlockquoteRule",
"selector":"blockquote"
},
{
"class":"ParagraphRule",
"selector":"p"
},
{
"class":"H2Rule",
"selector":"h2"
},
{
"class":"H1Rule",
"selector":"h1"
},
{
"class":"ListElementRule",
"selector":"ol, ul"
},
{
"class":"ListItemRule",
"selector":"li"
},
{
"class":"AnchorRule",
"selector":"a",
"properties":{
"anchor.href":{
"attribute":"href",
"selector":"a",
"type":"string"
}
}
},
{
"class":"ItalicRule",
"selector":"i"
},
{
"class":"EmphasizedRule",
"selector":"em"
},
{
"class":"BoldRule",
"selector":"b, strong"
},
{
"class":"ImageRule",
"selector":"img",
"properties":{
"image.url":{
"attribute":"src",
"selector":"img",
"type":"string"
},
"image.caption":{
"attribute":"src",
"selector":"img",
"type":"element"
}
}
},
{
"class":"IgnoreRule",
"selector":".STopImage"
},
{
"class":"IgnoreRule",
"selector":".EditorJsLinkTool img"
},
{
"class":"IgnoreRule",
"selector":".ComponentSelector"
},
{
"class":"IgnoreRule",
"selector":".ContentNext"
},
{
"class":"IgnoreRule",
"selector":".ContentNavigation"
},
{
"class":"IgnoreRule",
"selector":".ArticleAuthorAvatar"
},
{
"class":"IgnoreRule",
"selector":".ArticleTop"
},
{
"class":"IgnoreRule",
"selector":"header"
}
]
}
VERSION: 0.2.0
URL: http://example/default.aspx
RULES:
{
"generator_name": "facebook-instant-articles-builder",
"generator_version": "0.2.0",
"rules": [
{
"class": "TextNodeRule"
},
{
"class": "BlockquoteRule",
"selector": "blockquote"
},
{
"class": "ParagraphRule",
"selector": "p"
},
{
"class": "H2Rule",
"selector": "h2"
},
{
"class": "H1Rule",
"selector": "h1"
},
{
"class": "ListElementRule",
"selector": "ol, ul"
},
{
"class": "ListItemRule",
"selector": "li"
},
{
"class": "AnchorRule",
"selector": "a",
"properties": {
"anchor.href": {
"attribute": "href",
"selector": "a",
"type": "string"
}
}
},
{
"class": "ItalicRule",
"selector": "i"
},
{
"class": "EmphasizedRule",
"selector": "em"
},
{
"class": "BoldRule",
"selector": "b, strong"
},
{
"class": "ImageRule",
"selector": "img",
"properties": {
"image.url": {
"attribute": "src",
"selector": "img",
"type": "string"
},
"image.caption": {
"attribute": "src",
"selector": "img",
"type": "element"
}
}
}
]
}
Support properties with type
exists
like related.sponsored
below:
{
"class": "RelatedItemRule",
"selector": "li",
"properties": {
"related.sponsored": {
"type": "exists",
"selector": "li",
"attribute": "data-sponsored"
},
"related.url": {
"type": "string",
"selector": "a",
"attribute": "href"
}
}
}
The current implementation of the builder uses a PHP webserver installed locally. This server receives two requests:
Source
tab.Preview
tab.Each time the user switches tabs, a new call is made to the webserver and the corresponding transformations are ran, regardless of presence of new changes. This causes some performance issues, which will be exacerbated if we keep adding tabs or other functionality that relies on the webserver (like the one describes in #149).
We should look for ways to optimize this functionality, perhaps using some sort of cache (either on the webserver or on the client).
We have a few challenges that we need to account for:
Source
view leverages the browser's view-source:{URL}
to format the markup.Preview
tab relies on a given URL returning a web page.I tried several days to get preview but unable to get preview. I am using Joomla and tried for kantipathnews. Is there any thread to fix this?
I think "Instant-Article-builder also not installed but runs from folder.
We have duplicated code to generate the icons for the labels of required and optional fields. Let's refactor the code by adding constants for the characters used to display the checkmark and bullet point, and also create a helper function to generate the labels based on the value of their respective prop.
We should not open the repository with the tool pointing to my blog.
Hi,
How ad placement and analytics code (google, chartbeat etc) will work if we use this tool. As we are only defining the structure of the article, will it be possible for facebook to extract all the info of that article via web page of that article (analytics and ads for that article), rendered as instant article on mobile with all the analytics and ad code.
Regards
The README file only contains the install instructions for Mac. We should also include the instructions for Windows.
Some of the default rules defined in the SDK use XPath selectors. Should we also add support for them?
Example:
{
"class": "InstantArticleRule",
"selector": "head",
"properties": {
"article.canonical": {
"type": "string",
"selector": "link",
"attribute": "href"
},
"article.charset": {
"type": "xpath",
"selector": "//meta[@charset]",
"attribute": "charset"
},
"article.markup.version": {
"type": "xpath",
"selector": "//meta[@property='op:markup_version']",
"attribute": "content"
},
"article.auto.ad": {
"type": "xpath",
"selector": "//meta[@property='fb:use_automatic_ad_placement']",
"attribute": "content"
},
"article.style": {
"type": "xpath",
"selector": "//meta[@property='fb:article_style']",
"attribute": "content"
}
}
}
The Annapurna Sanctuary is a high glacial basin lying 40 km directly north of Pokhara . Pokhara is a city on Phewa Lake, in central Nepal. It’s known as a gateway to the Annapurna Circuit, a popular trail in the Himalayas. This oval-shaped plateau sits at an altitude of over 4000 meters , and is surrounded by a ring of mountains, the Annapurna range, most of which are over 7000 meters.
from Annapurna base camp
Fact about Annapurna base camp
Elevation-: 4130 m (13,550 ft)
Parent Range-: Himalayas
The best months to trek -: pre-monsoon (February, March, April and May) and post monsoon (late September, October, November and December) It is possible to make the journey in January and early September but we prefer the above months .
How much time to take-: The Annapurna Base Camp Trek takes 7 to 12 days, depending on your itinerary and length of walking days. The itinerary presented here takes 12 days, starting from Nayapul (a 1 1/2 hour drive from Pokhara ) and going north up to Ghorepani and the famous viewpoint at Poon Hill. From Ghorepani you go eastward to Chomrong and then north again entering the Modi Kola Valley which leads up to the Base Camp.
Annapurna
Annapurna base camp
Every time it is not possible to load a preview, the following message is displayed:
The Preview is loaded when all required fields are filled. Although the message shows that it was not possible to load the preview section, it is not clear that the reason is because of one of the mandatory fields was not entered.
The above message should be displayed as default when the page is loading but once user start filling the fields, the message should be:
"Please, select all required fields to generate a preview"
List of potential websites that might not be compatible with IA:
sfgate.com
https://www.sun-sentinel.com/entertainment/restaurants-and-bars/fl-et-viz-lets-go-momosan-iron-chef-morimoto-20210211-3koi3fkwqjaa5np2pltnufemym-story.html
Hello, I have a website and I have more than 100k page viewers per month on my website, and I also have a facebook page with more than 2000+ followers but when I apply to instant article every time it shows me "The provided URL is not being accepted because the site has minimal readership" why this happens every time and I follow every policy of Facebook. and i place the code perfectly in WordPress.
My Website Url: http://musicworldarj.com
Facebook Page Url: https://www.facebook.com/MusicWorldArj
Please help me,
Hello,
I have used the desktop (iMac) version to try and build an instant article. All of the 'ticks' were green, and I embedded the HTML code into the header of the article (via my Wordpress site) but still the article does not load as IA when I share the URL on my Facebook page (Emergency Services Humour)
https://emergencyservices.media/?p=2094 is the article
<meta property="ia:rules_url" content="path/to/your/rules-file.json"/>
is the code
Couple of issues when trying to install, as follows:
If unpacking under a folder structure, a few folders away from the root, Windows reports that the files cannot be unpacked because the folder depth is too deep. Not a huge problem, since you can create a folder directly under root, and get your unpack accomplished.
When trying to fire up the "Instant Articles Builder.exe" file, the built-in Windows protection steps in and shows the following messages:
Windows protected your PC
Microsoft Defender SmartScreen prevented an unrecognized app from starting. Running this app might put your PC at risk.
Click on "More info" and you get this:
App: | Instant Articles Builder.exe
Publisher: | Unknown publisher
There is no README, so this is of course, a bit of a concern.
I'm starting off with this:
<div class="video-container"> <iframe width="560" height="315" src="https://www.youtube.com/embed/IQ46DXEQn-Y" frameborder="0" allow="autoplay; encrypted-media" class="videoia" allowfullscreen=""></iframe> </div>
Here's what I have in the rules document:
{"class":"InteractiveRule","selector":"div.video-container","properties":{"interactive.iframe":{"selector":"*","type":"element"},"interactive.url":{"attribute":"src","selector":"iframe","type":"string"}}}
Here's the result:
I've tried everything I know how to get rid of the div tags and only leave one instance of the iframe.
What am I doing wrong here?
We are sending a single property with type date
, which is preventing the tool from using two major use cases to parse date-time fields:
<p>December 15, 2017</p>
<meta property="article:published_time" content="2018-01-10" />
Should we also support string attributes?
The "selector" field on the RulePicker should behave the same as the PropertyPickers.
VERSION: 0.2.0
URL: https://esporte.uol.com.br/futebol/ultimas-noticias/2019/03/08/um-mes-depois-sobrevivente-de-incendio-no-fla-evolui-mas-nao-tem-alta.htm
RULES:
{
"analytics": {
"fb_pixel_id": "",
"raw_html": "<script type=\"text/javascript\">alert(\"teste\");</script>"
},
"ads": {
"raw_html": "<script type=\"text/javascript\">alert(\"ads\");</script>"
},
"style_name": "uol",
"generator_name": "facebook-instant-articles-builder",
"generator_version": "0.2.0",
"rules": [
{
"class": "TextNodeRule"
},
{
"class": "GlobalRule",
"selector": "html",
"properties": {
"article.title": {
"attribute": "content",
"selector": "span i",
"type": "element"
},
"article.publish": {
"format": "Y-m-d\\TH:i:s",
"selector": "[ia-date]",
"type": "date"
},
"author.name": {
"selector": "[ia-author]",
"type": "string"
},
"image.url": {
"attribute": "content",
"selector": "[property=\"og:image\"]",
"type": "string"
},
"article.body": {
"attribute": "content",
"selector": ".text",
"type": "element"
},
"article.canonical": {
"attribute": "href",
"selector": "link[rel=canonical]",
"type": "string"
}
}
},
{
"class": "BlockquoteRule",
"selector": "blockquote"
},
{
"class": "ParagraphRule",
"selector": "p"
},
{
"class": "H2Rule",
"selector": "h2"
},
{
"class": "H1Rule",
"selector": "h1"
},
{
"class": "ListElementRule",
"selector": "ol, ul"
},
{
"class": "ListItemRule",
"selector": "li"
},
{
"class": "AnchorRule",
"selector": "a",
"properties": {
"anchor.href": {
"attribute": "href",
"selector": "a",
"type": "string"
}
}
},
{
"class": "ItalicRule",
"selector": "i"
},
{
"class": "EmphasizedRule",
"selector": "em"
},
{
"class": "BoldRule",
"selector": "b, strong"
},
{
"class": "ImageRule",
"selector": "img",
"properties": {
"image.url": {
"attribute": "src",
"selector": "img",
"type": "string"
},
"image.caption": {
"attribute": "src",
"selector": "img",
"type": "element"
}
}
}
]
}
We need to upgrade some dependencies as there were some vulnerabilities detected:
Reported as one of the items in #145. I believe the solution is to sign the file, but we'll need to investigate the best way to accomplish this.
This is considered low-priority.
Hi,
I have followed the instructions (being a layman) as indicated in your 'how to' guides (screen shot attached) but the articles are still not loading on Facebook as IA format?
This is the code I have inputted:
As instructed to via this link:
https://developers.facebook.com/docs/instant-articles/crawler-ingestion#rules-reference
Running the jest tests on the rules editor project issues a warning regarding watchman.
jest-haste-map: Watchman crawl failed. Retrying once with node crawler. Usually this happens when watchman isn't running. Create an empty .watchmanconfig file in your project's root folder or initialize a git or hg repository in your project.
Should we set up a watcher (using watchman) for this project to rebuild when any code changes are made? This will get rid of the jest warning as well.
More on watchman here: https://facebook.github.io/watchman/
VERSION: 0.2.2
URL: http://exkluziv.net/svim-strancima-dopusten-ulazak-u-bih-s-negativnim-pcr-testom/
RULES:
{
"generator_name": "facebook-instant-articles-builder",
"generator_version": "0.2.2",
"rules": [
{
"class": "TextNodeRule"
},
{
"class": "GlobalRule",
"selector": "html",
"properties": {
"article.title": {
"attribute": "content",
"selector": "h1.entry-title",
"type": "element"
},
"article.publish": {
"attribute": "datetime",
"format": "Y-m-d\\TH:i:sP",
"selector": "time",
"type": "date"
},
"author.name": {
"selector": ".author-box-wrap .td-author-name",
"type": "string"
},
"image.url": {
"attribute": "src",
"selector": ".td-modal-image",
"type": "string"
},
"article.body": {
"attribute": "content",
"selector": ".td-post-content",
"type": "element"
},
"article.canonical": {
"attribute": "href",
"selector": "link[rel=canonical]",
"type": "string"
}
}
},
{
"class": "BlockquoteRule",
"selector": "blockquote"
},
{
"class": "ParagraphRule",
"selector": "p"
},
{
"class": "H2Rule",
"selector": "h2"
},
{
"class": "H1Rule",
"selector": "h1"
},
{
"class": "ListElementRule",
"selector": "ol, ul"
},
{
"class": "ListItemRule",
"selector": "li"
},
{
"class": "AnchorRule",
"selector": "a",
"properties": {
"anchor.href": {
"attribute": "href",
"selector": "a",
"type": "string"
}
}
},
{
"class": "ItalicRule",
"selector": "i"
},
{
"class": "EmphasizedRule",
"selector": "em"
},
{
"class": "BoldRule",
"selector": "b, strong"
},
{
"class": "ImageRule",
"selector": "img",
"properties": {
"image.url": {
"attribute": "src",
"selector": "img",
"type": "string"
},
"image.caption": {
"attribute": "src",
"selector": "img",
"type": "element"
}
}
}
]
}
When starting an article, then clicking through the tutorial, progress on article is lost.
VERSION: 0.2.0
URL: https://talikanews.com/2018/12/17/baiq-diyah-gunakan-moment-hut-ntb-ke-60-koreksi-sungai-di-mataram/
RULES:
{
"generator_name": "facebook-instant-articles-builder",
"generator_version": "0.2.0",
"rules": [
{
"class": "TextNodeRule"
},
{
"class": "BlockquoteRule",
"selector": "blockquote"
},
{
"class": "ParagraphRule",
"selector": "p"
},
{
"class": "H2Rule",
"selector": "h2"
},
{
"class": "H1Rule",
"selector": "h1"
},
{
"class": "ListElementRule",
"selector": "ol, ul"
},
{
"class": "ListItemRule",
"selector": "li"
},
{
"class": "ItalicRule",
"selector": "i"
},
{
"class": "EmphasizedRule",
"selector": "em"
},
{
"class": "BoldRule",
"selector": "b, strong"
},
{
"class": "ImageRule",
"selector": "img",
"properties": {
"image.url": {
"attribute": "src",
"selector": "img",
"type": "string"
},
"image.caption": {
"attribute": "src",
"selector": "img",
"type": "element"
}
}
}
]
}
We are excluding the class
attribute of selected DOM elements. Some of the rules e.g. H1Rule
expects the class
attribute to be used to set properties.
To solve this issue it is NOT enough with removing class
from the list of excluded attributes since as part of the highlighting process we add new classes to the element. We will have to remove all the classes added by us first.
VERSION: 0.2.2
URL: https://www.oninitiative.com/learn/towards-the-art-of-home-improvement-the-garden/
RULES:
{
"generator_name": "facebook-instant-articles-builder",
"generator_version": "0.2.2",
"rules": [
{
"class": "TextNodeRule"
},
{
"class": "GlobalRule",
"selector": "html",
"properties": {
"article.title": {
"attribute": "content",
"selector": ".blog-title",
"type": "element"
},
"author.name": {
"selector": ".blog-header .blog-date",
"type": "string"
},
"image.url": {
"attribute": "src",
"selector": ".lazyautosizes",
"type": "string"
},
"article.body": {
"attribute": "content",
"selector": ".blog-post",
"type": "element"
},
"article.canonical": {
"attribute": "href",
"selector": "link[rel=canonical]",
"type": "string"
}
}
},
{
"class": "BlockquoteRule",
"selector": "blockquote"
},
{
"class": "ParagraphRule",
"selector": "p"
},
{
"class": "H2Rule",
"selector": "h2"
},
{
"class": "H1Rule",
"selector": "h1"
},
{
"class": "ListElementRule",
"selector": "ol, ul"
},
{
"class": "ListItemRule",
"selector": "li"
},
{
"class": "AnchorRule",
"selector": "a",
"properties": {
"anchor.href": {
"attribute": "href",
"selector": "a",
"type": "string"
}
}
},
{
"class": "ItalicRule",
"selector": "i"
},
{
"class": "EmphasizedRule",
"selector": "em"
},
{
"class": "BoldRule",
"selector": "b, strong"
},
{
"class": "ImageRule",
"selector": "img",
"properties": {
"image.url": {
"attribute": "src",
"selector": "img",
"type": "string"
},
"image.caption": {
"attribute": "src",
"selector": "img",
"type": "element"
}
}
}
]
}
With the introduction of selectors for rules e.g. the CaptionRule has a default selector of span.caption the algorithm to resolve a selector for a given DOM element (click-to-find feature) needs to be updated to take into account the "scope" of the rule.
We need to pass a new parameter to the existing algorithm so that it can resolve the best selector given the rule's scope determined by the rule selector.
We should add some tests to make sure it is clear that we are using the PHP date format.
Requested at #67
Requested by @mburak at #83 (comment).
We should add some messaging to explain when a field is required, optional, or just controlling the appearance of other fields.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.