6

I need to disable the Gutenberg text-settings tab in all Blocks. Is this possible with a funtion in funtions.php?

I could disable the colors tab, but found no solution for the text-settings:

function disable_tabs() {
    add_theme_support( 'editor-color-palette' );
    add_theme_support( 'disable-custom-colors' );
}
add_action( 'after_setup_theme', 'disable_tabs' );

The text-settings tab

1
  • 1
    Do you mean in all paragraph blocks ?
    – birgire
    Jan 24, 2019 at 14:20

4 Answers 4

7

The closest I can find in the documentation is disabling custom font size (the text input) and forcing the dropdown font size to only contain "Normal".

add_action('after_setup_theme', 'wpse_remove_custom_colors');
function wpse_remove_custom_colors() {
    // removes the text box where users can enter custom pixel sizes
    add_theme_support('disable-custom-font-sizes');
    // forces the dropdown for font sizes to only contain "normal"
    add_theme_support('editor-font-sizes', array(
        array(
            'name' => 'Normal',
            'size' => 16,
            'slug' => 'normal'
        )
    ) );
}

Note this may not work for non-Core blocks - they may have their own way of registering font size etc. that isn't affected by theme_support. Hoping someone else from the community knows how to disable the drop caps as well.

Update: a way to remove Drop Caps

This wouldn't be my preferred method, because you can still add a Drop Cap in the editor and it just doesn't render in the front end, but it's all I have been able to achieve so far:

There is a render_block() hook where you can change what renders on the front end without changing what shows in the editor or gets saved to the database.

add_filter('render_block', function($block_content, $block) {
    // only affect the Core Paragraph block
    if('core/paragraph' === $block['blockName']) {
        // remove the class that creates the drop cap
        $block_content = str_replace('class="has-drop-cap"', '', $block_content);
    }
    // always return the content, whether we changed it or not
    return $block_content;
}, 10, 2);

This method changes the outer appearance rather than the actual content, so that if you ever wanted to allow drop caps, you could just remove the filter and all the ones that people had added in the editor would suddenly appear.

4
  • 2
    There's now a proposal to add a block_editor_features hook to take care of font sizes, drop caps, and a whole bunch of other settings. It's not rolled into Core yet but it's on the way. github.com/WordPress/gutenberg/issues/20588
    – WebElaine
    Mar 30, 2020 at 14:14
  • 3
    I can't wait... this is so frustrating. We don't need Drop Caps ! (not always)
    – Max
    Mar 30, 2020 at 16:44
  • 3
    It appears that calling add_theme_support('editor-font-sizes'); (without the array) now removes the dropdown menu completely. Apr 13, 2020 at 20:29
  • @JimRhoades or the array could be left empty — works either way, and the code gets a little bit clearer (that something gets removed rather than added). Sep 18, 2020 at 11:21
5

There's good answers about disabling the font styles but not about disabling the drop cap.

In WordPress 5.8, you can you the new theme.json feature to disable drop caps in your theme. You need to add a file with name theme.json in the root of your theme. It should have the following content:

{
    "version": 1,
    "settings": {
        "typography": {
            "dropCap": false
        }
    }
}

If you want to use a filter instead, you can use the following code in WordPress 5.8:

function disable_drop_cap_ editor_settings_5_8(array $editor_settings): array {
    $editor_settings['__experimentalFeatures']['typography']['dropCap'] = false;
    return $editor_settings;
}
add_filter('block_editor_settings', 'disable_drop_cap_ editor_settings_5_8');

In WordPress 5.7, the drop cap can be disabled with the following code:

function disable_drop_cap_editor_settings_5_7(array $editor_settings): array {
    $editor_settings['__experimentalFeatures']['defaults']['typography']['dropCap'] = false;
    return $editor_settings;
}
add_filter('block_editor_settings', 'disable_drop_cap_editor_settings_5_7');

In WordPress 5.6, the following code works:

function disable_drop_cap_editor_settings_5_6(array $editor_settings): array {
    $editor_settings['__experimentalFeatures']['global']['typography']['dropCap'] = false;
    return $editor_settings;
}
add_filter('block_editor_settings', 'disable_drop_cap_editor_settings_5_6');

In WordPress 5.5, you will have to use JavaScript to accomplish the same thing:

function disable_drop_cap_admin_footer() {
    echo <<<HTML
<script>
document.addEventListener("DOMContentLoaded", function () {
  var removeDropCap = function(settings, name) {
      
    if (name !== "core/paragraph") {
      return settings;
    }
    var newSettings = Object.assign({}, settings);
    if (
      newSettings.supports &&
      newSettings.supports.__experimentalFeatures &&
      newSettings.supports.__experimentalFeatures.typography &&
      newSettings.supports.__experimentalFeatures.typography.dropCap
    ) {
      newSettings.supports.__experimentalFeatures.typography.dropCap = false;
    }
    return newSettings;
  };
  wp.hooks.addFilter(
    "blocks.registerBlockType",
    "sc/gb/remove-drop-cap",
    removeDropCap,
  );
});
</script>
HTML;
}
add_action('admin_footer', 'disable_drop_cap_admin_footer');

If you want the functionality as a plugin, you can use the Disable Drop Cap plugin. Full disclosure, I'm the author of the said plugin.

2
  • 2
    As of WordPress 5.8, it's $editor_settings['_experimentalFeatures']['typography']['dropCap'], (without the default-key)
    – uruk
    Aug 25, 2021 at 5:55
  • 1
    block_editor_settings is now deprecated Jan 6 at 1:37
1

This was the true, final answer that solved for the exact scenario described in the original question:

/**
 * Disable Native Gutenberg Features
 */
function gutenberg_removals()
{
  add_theme_support('disable-custom-font-sizes');
  add_theme_support('editor-font-sizes', []);
}
add_action('after_setup_theme', 'gutenberg_removals');

Passing an empty array to the editor-font-sizes avoid a PHP notice for an invalid argument.

0

As Jim Rhoades noted in one of the comments, you can declare support for custom font sizes, but leave out the array of font size options. This removes the "Typography" section entirely so there is no way to choose a font size. The code looks like this:

add_theme_support( 'editor-font-sizes' );

For those looking for all the code needed to make it work, you would call this from the after_setup_theme hook inside the functions.php file within your theme:

function theme_setup() {
    add_theme_support( 'editor-font-sizes' );
}
add_action( 'after_setup_theme', 'theme_setup' );

I've tested this in WordPress 5.7, but it's possible it's supported before this version.

3
  • Both your answer and the one from Jim will throw an error argument must be of type array|object. Same goes for Kevin. Jan 6 at 1:40
  • Thanks a ton for the feedback @amarinediary. I wasn't seeing that error before, so it's possible it only appears under certain circumstances, such as in newer versions of WordPress. Can you provide more details on your setup, including what version of WordPress you're using? I'm sure that would be helpful to others who might be looking for a solution.
    – jg314
    Jan 6 at 13:10
  • 1
    5.8.2 latest. You have to pass an empty array. Also, There is a new text setting called "Drop cap" which isn't removed through editor-font-sizes. Jan 6 at 15:09

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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