Remove Gutenberg CSS

Remove Gutenberg CSS

I'm adding this as a more complete answer than my comment:

You need to remove the -css when trying to dequeue the script. That's added to the HTML markup and not the actual tag for the css file.

If you search the code (the location of the enqueue may change as Gutenberg gets rolled into core), you can find:

wp_enqueue_style( 'wp-block-library' );

As you can see, there is no -css. This solution may work for other plugins that people have trouble dequeuing styles.

Edit:
Since this still gets some traction, here is the code to handle it:

add_action( 'wp_print_styles', 'wps_deregister_styles', 100 );
function wps_deregister_styles() {
    wp_dequeue_style( 'wp-block-library' );
}

Do i need to remove this wp-block-library-css (Gutenberg CSS)?

I use to remove this stylesheet on websites which are not using Gutenberg.

I don't think there is other effect than removing this stylesheet, you can do it safely.

To go a bit further, you can remove it only for some post types like

function remove_wp_block_library_css() {
  if( !is_singular('post') ) {
    wp_dequeue_style( 'wp-block-library' );
  }
}
add_action( 'wp_enqueue_scripts', 'remove_wp_block_library_css' );

Remove embedded stylesheet for Gutenberg editor on the back end

I drilled down into how it was being injected and found a way to nuke it out via the block_editor_settings filter. There is a styles key with an array that contains the css. The only iffy thing about this for me is that I'm assuming the shape of the array will always be the same, I should be doing some type of check here.

add_filter( 'block_editor_settings' , 'remove_guten_wrapper_styles' );
public function remove_guten_wrapper_styles( $settings ) {
    unset($settings['styles'][0]);

    return $settings;
}

How to remove panels from Gutenberg in cleared way?

As you already know Gutenberg ignores remove_meta_box. You can remove a panel by doing the following:

In PHP register a script. Also register an empty block and add a JS file to it.

function hughie_register_files() {
    // script file
    wp_register_script(
        'hughie-admin-panels',
        plugins_url('/scripts/admin-panels.js', __FILE__),
        [ 'wp-blocks', 'wp-edit-post' ]
    );
    // register block editor script
    register_block_type( 'hughie/admin-panels', array(
        'editor_script' => 'hughie-admin-panels'
    ) );
}

In the JS file add any of the following lines:

wp.data.dispatch('core/edit-post').removeEditorPanel( 'taxonomy-panel-category' ) ; // category
wp.data.dispatch('core/edit-post').removeEditorPanel( 'taxonomy-panel-TAXONOMY-NAME' ) ; // custom taxonomy
wp.data.dispatch('core/edit-post').removeEditorPanel( 'taxonomy-panel-post_tag' ); // tags
wp.data.dispatch('core/edit-post').removeEditorPanel( 'featured-image' ); // featured image
wp.data.dispatch('core/edit-post').removeEditorPanel( 'post-link' ); // permalink
wp.data.dispatch('core/edit-post').removeEditorPanel( 'page-attributes' ); // page attributes
wp.data.dispatch('core/edit-post').removeEditorPanel( 'post-excerpt' ); // Excerpt
wp.data.dispatch('core/edit-post').removeEditorPanel( 'discussion-panel' ); // Discussion

Your problem is you only want to include the file is the user has a certain capability.

All WP hooks can be found at: https://codex.wordpress.org/Plugin_API/Action_Reference

By the time init is called the user should be defined and available to check

---

Related Topics