Guides and Sample Code

Developer

Apple News Format Reference

On This Page

Component Role Summary

This appendix summarizes all available component roles. Refer to the individual component definitions for more details.

Text Roles

body

Article body text.

title

Text that will be treated and positioned as the article title or headline.

heading

Text that will be treated as a heading or subheading, depending on the context. You can use multiple levels of subheadings: heading1, heading2, heading3, heading4, heading5, heading6.

intro

An introduction or other preliminary text. You're not required to mark the introductory text as such, but you may find it useful to do so, in case you later need to style it differently.

pullquote

Usually a selection from the body text, often used to break up long portions of text or draw attention to a specific section.

quote

A quotation in the article text. A quote is treated differently than a pullquote: a quote is a unique portion of text, while a pullquote duplicates a selection of text.

caption

Caption text for another component in the document, such as a photo.

byline

Text that describes one or more contributors to the article.

author

The name of an author of the article.

photographer

The name of a contributor whose photographs appear in the article.

illustrator

The name of a contributor whose illustrations appear in the article.

Image Roles

photo

A photograph.

figure

A figure or illustration that adds important context to the article.

logo

An image that identifies a brand, company, or publication.

portrait

An image that is a portrait of a person.

gallery

A collection of images displayed in a horizontal strip.

mosaic

A collection of images displayed in a mosaic layout.

Media Roles

map

A component display a geographical location or area on a map.

place

A component display a specific point of interest on a map.

video

A component that can play a video.

embedvideo

A component that contains a link to an embeddable web video (YouTube or Vimeo).

audio

A component that can play audio.

music

A component that plays an audio file and can also display an accompanying image (such as cover art).

Social Media Roles

facebook_post

A component that embeds a Facebook post in an article.

instagram

A component that embeds an Instagram post in an article.

tweet

A component that embeds a Twitter tweet in an article.

Table Roles

datatable

A component that presents data as rows and columns. The data is provided as Apple News Format JSON within the component.

htmltable

A component that presents data as rows and columns. The data is provided as an HTML <table> element within the component.

Advertisement Roles

banner_advertisement

A component for advertisements that span the full width of the display.

medium_rectangle_advertisement

A component for advertisements with a fixed size of 300 x 250 points.

Other

header

A component with child components that are rendered relative to the parent component. Headers can also include layout and styling information.

container

A component with child components that are rendered relative to the parent component. Containers can also include layout and styling information.

divider

A horizontal divider line.

section

A full-width container with child components. See the Section component definition for more details.

chapter

A type of section; text that is intended to be viewed as a chapter.

aside

A component that contains text that News personalization will ignore. Contains child components that are rendered relative to the parent component. Can include layout and styling information.