Span
Schema type reference for the Span type.
A span is a text range inside a block. Spans are the members of a block’s children array, and each one carries a piece of the block’s text together with the marks applied to it.
You never declare a span type yourself. The Portable Text editor creates spans as you type, as part of the block type. To control what a span can carry, configure the block type’s marks.decorators and marks.annotations instead. See Customize the Portable Text Editor.
Properties
These are the properties of a span as it is stored in the Content Lake. They are written by the editor, not declared in your schema.
Required_type
string
Always
span. Set by the editor.Required_key
string
A unique key within the block’s
childrenarray. Required on every span, and the only way to address a span in a patch. Never write a span without one.Requiredtext
string
The span’s text content.
marks
array
The marks applied to this span. Decorator values appear as plain strings, such as
strong. Annotations appear as the_keyof an entry in the parent block’smarkDefsarray. Omitted when the span has no marks.
How marks are stored
When you configure decorators and annotations for the Portable Text editor, these are stored as values in a span’s marks. Decorators are stored as plain text strings, and annotations as keys that reference entries in the block’s mark definitions (markDefs). In the example below, there are marks in the third span with the values strong and cbe9d12c6af9. Most presentation layers will represent the strong as in a bold typeface. The other value is a key that corresponds to an object entry under markDefs that describes a link.
{
"_key": "9d2d1ed68d84",
"_type": "block",
"style": "normal",
"children": [
{
"_key": "a1f4c2d90b31",
"_type": "span",
"marks": [],
"text": "I am "
},
{
"_key": "b7e5d3a81c42",
"_type": "span",
"marks": [
"strong"
],
"text": "strong and "
},
{
"_key": "c8f6e4b92d53",
"_type": "span",
"marks": [
"strong",
"cbe9d12c6af9"
],
"text": "annotated"
}
],
"markDefs": [
{
"_key": "cbe9d12c6af9",
"_type": "link",
"href": "https://example.com/annotations"
}
]
}Render spans on the frontend
Spans and blocks are defined in the Portable Text specification for data storage. They describe how the data is stored, which is what a frontend reads when it renders rich text. To see how to render custom annotations and decorators, see Presenting Portable Text.