When we first launched Instant Articles, we gave publishers a handful of ways to control the look and feel of their brands on the platform. Now with thousands of partners publishing Instant Articles, we're excited to see more approaches to design and layout emerging.
Today we're updating our article styling tools to give publishers more power over brand expression in Instant Articles. With new creative options publishers have the flexibility to customize their article design to more closely match the mobile web.
We're rolling out the update over the next few weeks, and here are some of the improvements you can look out for:
We're introducing a real-time preview tool that shows publishers what alterations look like as they make them. An example article appears alongside the styling options so that as publishers adjust fonts, text sizes, colors and alignment, for example, they can preview what these elements will look like in a published article.
Publishers can now more granularly control how they display text in their articles. The following are now available for publishers to experiment with in the style editor:
To highlight text or media content with spatial cues, publishers can now refashion the white space within their articles. The following are spatial elements publishers can fine-tune:
We also heard that publishers wanted a way to reuse some of the basic settings of old styles in their new styles without having to recreate the old styles from scratch. Now there's a way to duplicate styles so that nuanced adjustments are simple to make.
To duplicate a style:
All articles in which you have implemented a style will take on any changes you make to that style. To design a new style and implement it in new future articles, we recommend duplicating and iterating an old style or creating a new style altogether.
To apply a new style to an article, specify the style name in the article markup. In the code snippet below, the style named “yourstyle” will be applied to the articles with this markup:
<meta property="fb:article_style" content="yourstyle">
We're excited to give publishers more creative control over how Instant Articles represents their brand.