Get help on Discord

How to use Rich Text from Sanity: Abstract Syntax Tree and Renderer

5 replies
Last updated: May 18, 2022
Hi,
could you help me figure out how to use rich text from sanity?

Can I not query data from the field as HTML?

I can only see stuff like:

{
"content": [
    {
    "children": [
        {
        "text": Some bold text
        }
        {
        "text": some normal text.
        }
If I make some text bold, it becomes a child.

What am I missing?

Thanks!
May 18, 2022, 12:11 PM
May 18, 2022, 12:17 PM
The rich text data doesn’t yield HTML, it yields an AST (Abstract Syntax Tree) so it can eventually be rendered in any sort of format (HTML, JSX, etc.).
May 18, 2022, 12:23 PM
So you need a renderer. If you use React, then you should use the library you just linked. If you want HTML, you want https://github.com/portabletext/to-html .
May 18, 2022, 12:23 PM
There is a list of renderers here: https://www.sanity.io/docs/presenting-block-text
May 18, 2022, 12:23 PM
Thank you!
May 18, 2022, 12:34 PM

Sanity – Build the way you think, not the way your CMS thinks

Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.

Get started for freeExplore the demo

Was this answer helpful?