Contents

Heading

The text component for adding a heading.

Declaration

object Heading

Properties

NameTypeDescription
role Requiredstring

Always one of these roles for this component: heading, heading1, heading2, heading3, heading4, heading5, or heading6.

text Requiredstring

The text to display in the article, including any formatting tags depending on the format property.

You can also use a subset of HTML tags or Markdown syntax by setting format to html or markdown, respectively. See Using HTML with Apple News Format. Alternatively, you can style ranges of text individually using the InlineTextStyle object.

additions[Addition]

An array of all the additions that you apply to ranges of the component’s text.

If you set format to html or markdown, Apple News Format doesnʼt support Additions or InlineTextStyles.

anchorAnchor

An object that defines vertical alignment with another component.

animation(ComponentAnimation | string("none"))

An object that defines an animation you apply to the component.

Use the none value for conditional design elements. Adding it here has no effect.

behavior(Behavior | string("none"))

An object that defines behavior for a component, like Parallax or Springy.

Use the none value for conditional design elements. Adding it here has no effect.

conditional(ConditionalText | [ConditionalText])

An instance or array of text components that you can apply conditionally, and the conditions that cause Apple News Format to apply them.

formatstring

The formatting or markup method applied to the text.

If you set format to html or markdown, Apple News Format doesn’t support Additions or InlineTextStyles.

hiddenboolean

A Boolean value that determines whether the component is hidden.

identifierstring

An optional unique identifier for this component. If you use identifier, it must be unique across the entire document. You need an identifier for your component if you want to anchor other components to it.

inlineTextStyles([InlineTextStyle] | string("none"))

An array of InlineTextStyle objects that you can use to apply different text styles to ranges of text. For each InlineTextStyle, you should supply a rangeStart, a rangeLength, and either a TextStyle object or the identifier of a TextStyle that you define at the top level of the document.

Apple News Format ignores inline text styles when format is set to markdown or html.

Use the none value for conditional design elements. Adding it here has no effect.

layout(ComponentLayout | string)

An inline ComponentLayout object that contains layout information, or a string reference to a ComponentLayout object that you define at the top level of the document.

If you don’t define layout, size and position are based on various factors, such as the device type, the length of the content, and the role of this component.

style(ComponentStyle | string | string("none"))

An inline ComponentStyle object that defines the appearance of this component, or a string reference to a ComponentStyle object that you define at the top level of the document.

Use the none value for conditional design elements. Adding it here has no effect.

textStyle(ComponentTextStyle | string)

An inline ComponentTextStyle object that contains styling information, or a string reference to a ComponentTextStyle object that you define at the top level of the document.

Mentioned in

Discussion

Use a Heading component to define a heading. There are six levels of headings. The role strings for the supported heading levels are heading, heading1, heading2, heading3, heading4, heading5, and heading6.

Example

{
  "components": [
    {
      "role": "heading",
      "text": "Not only on Mars"
    }
  ]
}

See Also

Text