How can I access core/paragraph textColor in a block template

by

I am trying to set the default textColor of an Innerblocks => paragraph in my Gutenberg block plugin.

The problem seems to be that placeholder is an attribute but textColor is passed as a prop https://github.com/WordPress/gutenberg/blob/master/packages/block-library/src/paragraph/edit.js

Wondering if anyone has figured out how to set this. Or if it is not possible.

The documentation does not seem to cover this https://developer.wordpress.org/block-editor/developers/block-api/block-templates/

<InnerBlocks
  template={[
    ["core/paragraph", { placeholder: "Enter side content...", textColor: '#EF4A23' }]
  ]}
/>

1
1

As of the end 2020, I have found that the best way to find attributes related to a core block is to inspect it with the react developer tools.

Under the components tab, search for [BLOCK_NAME]Edit to find the editing component, where [BLOCK_NAME] is something like “Paragraph”, “Heading” or “Button”.

Then on the right side in the inspector you can see the related attributes.

To answer the original question, at the current moment, the attribute is textColor.

const TEMPLATE = [
    [
        'core/paragraph',
        {
            textColor: '[YOUR-COLOR-SLUG]',
        },
    ]
]

In my case entering an hexadecimal value doesn’t seem to work. But this might be because I have disabled the custom color selector globally.

Leave a Comment