How can I override the container in PortableText? I want to use another element than <p>.

5 replies

Last updated: Jan 8, 2021

Jan 8, 2021, 11:11 AM

I added a serializer which overrides the block component

block: (props) => {
      return React.createElement('div', null, props.children);
    }

Jan 8, 2021, 11:22 AM

I added a serializer which overrides the block component

block: (props) => {
      return React.createElement('div', null, props.children);
    }

Jan 8, 2021, 11:22 AM

No, I copied the PortableText & serializers from a template and modified it to my needs.

Jan 8, 2021, 11:56 AM

Jan 8, 2021, 12:16 PM

Depends on the framework you use. There is a list here.

Jan 8, 2021, 12:16 PM

Sanity– build remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.