How to remove core WordPress blocks

While I try to support all the core blocks in the themes I build, sometimes it makes sense to remove a few.

Typically it’s because I built a custom block that’s similar to a core block while addressing the design and functional requirements of the theme. Most of my themes include a “Content and Image” block that’s similar to the “Media & Text” block but it uses the theme’s grid layout.

Sometimes I’ll unregister the “Search” block and create my own that uses the searchform.php file in the theme, ensuring the Search block matches the design and functionality of the search form used everywhere else in the theme.

Enqueue block editor assets

You can use the enqueue_block_editor_assets hook to load scripts and styles into the block editor. My themes typically have an editor.js file that I use for block styles and unregistering block types.

I also enqueue any custom fonts used on the frontend so I can also use them in the editor styles.

/** * Gutenberg scripts and styles * */ function be_gutenberg_scripts() { wp_enqueue_style( 'theme-fonts', be_theme_fonts_url() ); wp_enqueue_script( 'theme-editor', get_template_directory_uri() . '/assets/js/editor.js', array( 'wp-blocks', 'wp-dom' ), filemtime( get_template_directory() . '/assets/js/editor.js' ), true ); } add_action( 'enqueue_block_editor_assets', 'be_gutenberg_scripts' ); /** * Theme Fonts URL * */ function be_theme_fonts_url() { return 'https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap'; }

Unregister block type

Now that you’ve created an editor.js file and enqueued it into the block editor, you can use wp.blocks.unregisterBlockType to unregister block types.

wp.domReady( () => { wp.blocks.unregisterBlockType( 'core/media-text' ); wp.blocks.unregisterBlockType( 'core/search' ); } );

Here’s a list of all the core block types.

Bill Erickson

Bill Erickson is a freelance WordPress developer and a contributing developer to the Genesis framework. For the past 14 years he has worked with attorneys, publishers, corporations, and non-profits, building custom websites tailored to their needs and goals.

Ready to upgrade your website?

I build custom WordPress websites that look great and are easy to manage.

Let's Talk

Reader Interactions

Comments

  1. Hung says

    Thanks for sharing. I however always wonder if this kind of removing creates more processes for system? Because the system is initiated aready, all default code has been processed. Then another script for removing a part of the system.

    It seems to be better in GUI but more requests need to be done? Please correct me if I am wrong.

    • Bill Erickson says

      I’m not familiar enough with the underlying Gutenberg codebase to know whether this approach has a performance impact. I agree, loading a separate JavaScript file to remove items added by another JavaScript file doesn’t seem ideal, but that seems to be the way things are done with React.

Leave A Reply