JoyConf 2026 is back. Content Confidence. Human Connection. Save your spot!

How to render the rich text field using React.js?

You can use the richTextResolver from our javascript SDK in your React.js components like in the code sample below. We recommend you to check also our Richtext field documentation out.

const StoryblokClient = require('storyblok-js-client')

let Storyblok = new StoryblokClient({
  accessToken: 'YOUR_TOKEN'
})

function createMarkup(storyblokHTML) {
  return {
    __html: Storyblok.richTextResolver.render(storyblokHTML),
  }
}

const RichTextField = ({ data }) => {
  return <div dangerouslySetInnerHTML={createMarkup(data)} />
}

export default RichTextField