How do I use a Link Addition (hyperlink) in Apple News Format without using markdown? - ios

Question

I know that it is possible to include a hyperlink in an Apple News Format article using markdown by doing the following:
{
"version": "1.0",
"identifier": "sketchyTech_Demo",
"title": "My First Article",
"language": "en",
"layout": {},
"components": [
{
"role": "title",
"text": "My First Article",
"textStyle": "titleStyle"
},
{
"role": "body",
"format": "markdown",
"text": "Here's a [hyperlink](http://sketchytech.blogspot.co.uk).",
"textStyle": "bodyStyle"
}
],
"componentTextStyles": {
"titleStyle": {
"textAlignment": "center",
"fontName": "HelveticaNeue-Bold",
"fontSize": 64,
"lineHeight": 74,
"textColor": "#000"
},
"bodyStyle": {
"textAlignment": "left",
"fontName": "Georgia",
"fontSize": 18,
"lineHeight": 26,
"textColor": "#000"
}
}
}
but in Apple News Format there is also a Link Addition type, which I presume should work in a similar way to inline text styles, which are placed inside a component like this:
{
"role": "title",
"text": "My First Article",
"textStyle": "titleStyle",
"inlineTextStyles": [{
"rangeStart": 3,
"rangeLength": 5,
"textStyle": {
"textColor": "#FF00007F"
}
}
}
Apple provides sample code:
{
"type": "link",
"URL": "http://www.apple.com",
"rangeStart": 0,
"rangeLength": 20
}
But it doesn't give any instructions on where it should be placed like the other elements do. It is also rather mysterious that it has a "type" key, which is unlike other elements. Not only this but in the type description it is described as a LinkAddition in all uppercase. I have tried various combinations, the most obvious of which I would guess to be
"linkAdditions": [{
"type": "link",
"URL": "http://www.apple.com",
"rangeStart": 0,
"rangeLength": 20
}]
added to a component in the same way as inlineTextStyles (because a block of text could have multiple links, just as it can have multiple styles) but I can't get this or any variants that I've tried to work. Is it perhaps that News Preview isn't yet capable of rendering this?

Answer 1

Add it under the "additions" property instead of under "linkAdditions" inside of the component as you expected.
For example, this should work:
...
"role": "body",
"text": "Article text goes here and here",
"additions": [{
"type": "link",
"URL": "http://www.apple.com",
"rangeStart": 0,
"rangeLength": 20
}],
...
Note: if the format is markdown it will ignore the additions property.