Modify the InnerBlocks 'Add block' block appender label

I'm using the button appender as specified in the docs.

// Utilise a predefined component
<InnerBlocks
    renderAppender={ InnerBlocks.ButtonBlockAppender }
/>

By default the title of the appender (when hovered over) is "Add block". I'd like to change this to a custom title without having to define a completely new custom appender. I can't find any way to do this after looking through the docs and block editor source code.

I see that the core Buttons and Columns blocks do this and modify the appender to "Add Button" and "Add Column" respectively. But so far I've been unable to locate where in the code the appender titles are modified.

Perhaps this is being done by updating the translation strings as someone suggested on Twitter.

I'm using the button appender as specified in the docs.

// Utilise a predefined component
<InnerBlocks
    renderAppender={ InnerBlocks.ButtonBlockAppender }
/>

By default the title of the appender (when hovered over) is "Add block". I'd like to change this to a custom title without having to define a completely new custom appender. I can't find any way to do this after looking through the docs and block editor source code.

I see that the core Buttons and Columns blocks do this and modify the appender to "Add Button" and "Add Column" respectively. But so far I've been unable to locate where in the code the appender titles are modified.

Perhaps this is being done by updating the translation strings as someone suggested on Twitter.

• block-editor

Share Improve this question edited Aug 23, 2021 at 14:52 dgwyer asked Aug 23, 2021 at 14:12 dgwyerdgwyer 48811 gold badge44 silver badges1212 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

After more digging I see how the core blocks do it now. It only works if there is ONE block type allowed as a child block, which isn't useful in my case.

https://github.com/WordPress/gutenberg/blob/trunk/packages/block-editor/src/components/button-block-appender/index.js#L37-L42

So, it looks like this is not possible right now unless you define your own custom appender.