Add a video component inside the header component.
- Apple News Format
- Apple News API
video component allows the user to control playback and hear audio.
On this page, you’ll learn how to add a video component.
Add a Video to the Header
To add a video to your article, you simply add a
video component to a
components array. Here, you’ll add a
video component to the
components array in the
In Download the Article Bundle Examples, you downloaded a bundle called
News that contains a thumbnail image. Now, you’ll move that image into your working folder and use it as a thumbnail.
video-stillfile from the
Desktop/Newsfolder to the folder that contains your working
_Design _Tutorial _Advanced/News _Design _Tutorial _Advanced _Article _3
In your working
articlefile, delete the first section, including its
componentsarray. The code you are deleting begins with the opening brace (
"role": "section",and ends with a closing bracket, a closing brace, and a comma (
Copy the example code Header Component: Copy This Code.
Paste the code inside the top-level
componentsarray, after the opening bracket (
Your code should look like the example code Header Component: Result.
After you make this change in your code, you can preview your working
article file in News Preview to see the video.
Header Component: Copy This Code
Header Component: Result
...) indicate lines of code that have been omitted from this example.