Contentful logo

Contentful Community

Rich text rendering via client-side Javascript?

We want to display Contentful rich text on our Shopify store.

Content is being pulled in client-side via Javascript/ajax, but the Contentful SDK rich-text-html-renderer requires Node or React server-side frameworks.

So, how do we render rich text using only client-side Javascript?

Hi @chad ,
I think that might not be possible. As you said, the rich-text-html-renderer needs the npm packages to work. However it should be easier to either use a simple JS script to parse a Markdown field, or to use an intermediate page (that you will need to host, for example on https://www.netlify.com/), that will render the rich-text content from Contentful, and then include that in your Shopify shop.

1 Like

Thanks for the reply @Alma

So, we need to code a custom Contentful rich text parser in JavaScript?

I’m surprised this isn’t something included with Contentful out-of-the-box.

Seems weird for a “headless” CMS to require a separate web-server running Node.js, just to enable rich text. Requiring an intermediate page decreases load times, as well. Is this a notable omission from the Contentful platform, or am I missing something?

Has anyone in this community attempted a Javascript-only rich-text renderer?

Are there any resources available that would help develop this?

Thanks!

1 Like