2

How do i remove some of the buttons in from a block toolbar in the gutenberg editor?
I thought there was a similar api to removing blocks for the paragraph block, something like but there is 0 documentation on how to remove this stuff:

wp.domReady( () => {
    // wp.data.select( 'core/rich-text' ).getFormatTypes()
    // ^ tried with 'core/image' but throws an error
    wp.richText.unregisterFormatType( 'core/image' );
    wp.richText.unregisterFormatType( 'core/strikethrough' );
    wp.richText.unregisterFormatType( 'core/keyboard' );
    wp.richText.unregisterFormatType( 'core/text-color' );
    wp.richText.unregisterFormatType( 'core/code' );
});

enter image description here

Improve this question
6
  • Images don't use format types, those are only for blocks that use richtext components such as paragraphs etc. What's the problem you're trying to solve by doing this? I was recently asked to do this where an image block was being used and then parsed for a featured image, in the end the solution was to use a featured image block instead.
    – Tom J Nowell ♦
    Commented Apr 9, 2021 at 13:43
  • Also, individual buttons will have separate solutions, I have a solution here that will get rid of the link button, but I can't write an answer because your question requires all to be removed. For some of those buttons the answer is you don't. Any information about why you're doing this will be super, super helpful, and may lead ot an answer you hadn't thought of
    – Tom J Nowell ♦
    Commented Apr 9, 2021 at 13:50
  • 2
    @TomJNowell We're developing a custom site for a client and we want to clean up the interface as much as possibile, we've already disabled most blocks and some side panels, but it's better to remove the stuff which won't be used. The post will also generate a pdf and having to account for some edge cases is out of the budget. A simple css display:none would be enough to solve the issue but these buttons don't have a selector which doesn't cause issues with other toolbars it seems.
    – Matt
    Commented Apr 9, 2021 at 14:23
  • Ah if simplification is the goal then simplest solution ( and most futureproof ) would be to create a new block with a media element picker and an img tag, the image tag has seen numerous UI changes since it was introduced with things moving around ( wp 5.8/GB V10.3 does a lot of this ), e.g. alignment used too be 3 buttons and now it's a dropdown menu
    – Tom J Nowell ♦
    Commented Apr 9, 2021 at 14:27
  • I suggest approach with BlockEdit hook. I succeeded adding inspector controls in this way and enhancing core blocks, opposite way should also be possible. Use cloneElement to clone existing BlockControls and omit buttons which you do need. Some debugging and inspecting would be needed to find this elements.
    – Lovor
    Commented Apr 27, 2023 at 12:26

1 Answer 1

Reset to default
-1

Simply unregisterFormatType for all RichText component based blocks then registerFormatType conditionally for specific blocks like core/paragraph.

https://github.com/webaxones/formats/blob/master/filterFormatType.js

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.