Storyblok named a Leader in IDC MarketScape 2025 for AI-Enabled Headless CMS - Download it here!

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