2

I'm wondering if there is a way to remove the typography and custom color panels from the sidebar for just the paragraph block.

I've currently written a function that I've added add_theme_support to for the typography panel and custom color picker but it's affecting every block that can utilize those things. Here is said function:

    public function typography_custom_color_theme_support() {
        // Disable Custom Color Picker
        add_theme_support( 'editor-color-palette' );
        add_theme_support( 'disable-custom-colors' );
        // Disable Font Size and Custom Font Size Dropdowns
        add_theme_support( 'editor-font-sizes' );
        add_theme_support( 'disable-custom-font-sizes' );
}

If possible, could I add a conditional to this along the lines of "if paragraph block is selected run add_theme_support actions?"

Thank you.

4
  • 1
    have you looked into theme.json? What you're dealing with is a sub-set of the global styles system, which is heavily influenced by theme.json, if you don't have that file in your theme then you're opting out of the majority of the configuration options available, including some per-block/variation/style options
    – Tom J Nowell
    May 23, 2022 at 18:55
  • @TomJNowell, thanks for the response. Do you have any link showing how to utilize that? I'm not the most familiar with this and am trying to learn. Also, I'm trying to have this only affect Gutenberg blocks, would that affect where this json file goes or how the code would be written? May 23, 2022 at 19:07
  • 2
    only the official developer docs and the block editor handbook developer.wordpress.org/block-editor/reference-guides/…, and the question about where the JSON file goes doesn't make sense, none of this involves writing PHP code, just JSON configuration. I suggest reading up and looking at the default theme
    – Tom J Nowell
    May 23, 2022 at 19:37
  • Heard. I'll check that out, appreciate the feedback. Thank you. May 23, 2022 at 20:29

2 Answers 2

1

yes you can remove those options via theme.json but it has to be done block by block. This might help you (not my course): https://wpdevelopment.courses/articles/block-editor-typography-settings/#disable-font-size-controls

1
  • That is what I ended up doing and it worked. Thank you for sharing this and hopefully, it helps someone who may come across this in the future. Jul 28, 2022 at 21:28
2

Aug 2022

Using theme.json

The easier and most convenient way is to use theme.json. use false for all the properties.

Remove for only paragraph blocks

{
    "version": 2,
    "settings": {
        "blocks":{
            "core/paragraph":{
                "typography":{
                    "customFontSize": false,
                    "lineHeight": false,
                    "dropCap": false,
                    "fontStyle": false,
                    "fontWeight": false,
                    "letterSpacing": false,
                    "textDecoration": false,
                    "textTransform": false,
                    "fontSizes": [],
                    "fontFamilies": []
                }
            }
        }
    }
}

Remove for all

{
    "version": 2,
    "settings": {
        "typography":{
            "customFontSize": false,
            "lineHeight": false,
            "dropCap": false,
            "fontStyle": false,
            "fontWeight": false,
            "letterSpacing": false,
            "textDecoration": false,
            "textTransform": false,
            "fontSizes": [],
            "fontFamilies": []
        }
    }
}

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.