How to Remove Core Meta Boxes/Panels in WordPress Post Edit Screen

The post edit screen in WordPress has several boxes that show additional parameters that the user can edit/update.

These are default meta boxes for a post, provided by WordPress core. We can add more boxes using add_meta_box and using the hook add_meta_boxes.

add_action( 'add_meta_boxes', 'callback_add_meta_boxes' );
function callback_add_meta_boxes() {
   add_meta_box( $id, $title, $callback );
}

You can remove a custom meta box using this function –

remove_meta_box( $id, $screen, $context );

Now suppose, you have to remove a core meta box from the edit screen? How would you proceed? Before the introduction of the block editor, the process was same as removing a custom meta box, using the remove_meta_box function.

function remove_post_meta_boxes() {

     remove_meta_box('tagsdiv-post_tag', 'post', 'normal');
     remove_meta_box('categorydiv', 'post', 'normal');
     remove_meta_box('postimagediv', 'post', 'normal');
     remove_meta_box('authordiv', 'post', 'normal');
     remove_meta_box('postexcerpt', 'post', 'normal');
     remove_meta_box('trackbacksdiv', 'post', 'normal');
     remove_meta_box('commentstatusdiv', 'post', 'normal');
     remove_meta_box('postcustom', 'post', 'normal');
     remove_meta_box('commentstatusdiv', 'post', 'normal');
     remove_meta_box('commentsdiv', 'post', 'normal');
     remove_meta_box('revisionsdiv', 'post', 'normal');
     remove_meta_box('authordiv', 'post', 'normal');
     remove_meta_box('slugdiv', 'post', 'normal');
  
}

add_action( 'admin_menu', 'remove_post_meta_boxes' );

But if your site is using block editor then this method will not work, because now the meta boxes are panels in the edit screen and generated by JavaScript code.

There is no documentation to remove the boxes at the moment, but there is a roundabout way to achieve the same result.

Add a script to footer of edit page using the admin_enqueue_scripts –

function callback_admin_scripts() {    
    wp_enqueue_script('mainjs', get_template_directory_uri().'main.js', array(), "1.0", true);
}

add_action( 'admin_enqueue_scripts', 'callback_admin_scripts', 100, true );

This code can typically be placed in your theme’s functions.php file.

In the wp_enqueue_script function, the last parameter is set to true.

It is important that you set it to true, so that the script is loaded at the footer of edit post. Else you will get an error that the “wp” is not defined, which is the default JavaScript object of WordPress.

Here main.js is the script you want to add.

Put the following code in the main.js –

// category
wp.data.dispatch( 'core/edit-post').removeEditorPanel( 'taxonomy-panel-category' ); 

// tags
wp.data.dispatch( 'core/edit-post').removeEditorPanel( 'taxonomy-panel-post_tag' );

// featured image 
wp.data.dispatch( 'core/edit-post').removeEditorPanel( 'featured-image' );

// permalink
wp.data.dispatch( 'core/edit-post').removeEditorPanel( 'post-link' ); 

// page attributes
wp.data.dispatch( 'core/edit-post').removeEditorPanel( 'page-attributes' ); 

// Excerpt
wp.data.dispatch( 'core/edit-post').removeEditorPanel( 'post-excerpt' ); 

// Discussion
wp.data.dispatch( 'core/edit-post').removeEditorPanel( 'discussion-panel' ); 

// Template
wp.data.dispatch( 'core/edit-post').removeEditorPanel( 'template' );

The removeEditorPanel is a function that can be used to remove a panel from the edit page. It is available through wp which is the default JavaScript object of WordPress. It takes the ID of the panel that needs to be removed as parameter.

The IDs of the panels is given in the example above. For example the Category panel in the editor window is taxonomy-panel-category, the Tags panel is taxonomy-panel-post_tag etc.

This code hides most of the boxes in edit window. You can copy paste this code and remove the boxes/panels that you want to keep.

You may want to make this code conditional, that is, remove the boxes/panels for a certain user role only. In that case the script should be included depending on whether your condition is met or not.

if ( -- your conditional statement -- )
add_action( 'admin_enqueue_scripts', 'callback_admin_scripts', 100, true );

Till now JavaScript seems to be the only way to remove panels for sites using block editor.

Uncategorized