Modify styles of default paragraph/ heading nodes in Structured Text Editor

I would love to be able to apply different styles to the default heading/ paragraph blocks within the text editor preview itself in order to mimic how our website styles these. I’m able to add new custom styles (and how they appear in the text editor) via the customBlockStylesForStructuredTextField() hook, but adding something like:

      {
        id: 'paragraph',
        node: 'paragraph',
        label: 'Regular',
        appliedStyle: {
          fontFamily: 'Times',
          fontSize: '18px',
          lineHeight: '1.4',
        },
      },

or

      {
        id: 'regular',
        node: 'paragraph',
        label: 'Regular',
        appliedStyle: {
          fontFamily: 'Times',
          fontSize: '18px',
          lineHeight: '1.4',
        },

just adds another block style instead of modifying the default.

Is there a way to do this, or is this not supported right now?
image

Hey @brett,

I don’t think that is something you can do right now, sorry :frowning:

For editor previews, though, instead of modifying the CMS UI directly, there’s a plugin that can your editors the actual preview rendered as it would look on your website: https://www.datocms.com/marketplace/plugins/i/datocms-plugin-web-previews (requires some integration work, but not too much). Might that be better than trying to modify the Structured Text editor directly?

In general, we don’t allow plugins to override the functionality of built-in UI fields too much. You can replace them wholesale with field extensions, but doing that on a structured text field would be very hard because you would have to recreate the whole functionality of our default editor, just to add a style.

We can also convert this post into a feature request if you’d like (or feel free to start one). Sorry about that!

Hey @roger , that makes sense. We do enable pretty easy live previews already, it’s more just that I’d like to improve the UX of the structured text experience for content editors.

I would love to make this post into a feature request, is there an easy way to do that?

Done :slight_smile: Please remember to vote on it at the top.

1 Like