Although Gutenberg is the default editor in WordPress, not everyone wants to use it because of the bad editing experience. And Gutenberg loads CSS files and lots of inline styles on the front end, which will affect your website loading speed. This article will guide you on how to disable Gutenberg with a simple code without using plugins.
Why disable Gutenberg?
Gutenberg is the new editor added in WordPress 5.0. This editor promises to bring a whole new change and experience to users.
Nevertheless, after launching, it received plenty of criticism (more than praises) as it caused some problems for users, such as:
- Heavy JavaScript features make the editing experience bad or not smoothy
- Articles editing, images inserting are a bit more difficult than the previous editor
- Unable to use powerful features of the editor toolbar brought by the TinyMCE Advanced plugin.
- Can’t integrate the short-code buttons from other plugins into the editor toolbar.
Therefore, while Gutenberg is not really stable, it should be disabled. Otherwise, if you are using other plugins and you have conflicting problems, you should disable it and go back to the old editor interface.
Besides, Gutenberg outputs a lot of CSS and inline styles in your website's <head>. Here is a screenshot:
Disabling Gutenberg can help you have a better writing experience, and also increase the performance and loading time of your website by removing unused CSS. At the end, it will give your users a faster website, and might help to increase the search rankings.
How to disable Gutenberg with code?
It’s simple to disable Gutenberg, all you need to do is add the following code into the functions.php file in your theme:
// Disable Gutenberg on the back end.
add_filter( 'use_block_editor_for_post', '__return_false' );
// Disable Gutenberg for widgets.
add_filter( 'use_widgets_block_editor', '__return_false' );
add_action( 'wp_enqueue_scripts', function() {
// Remove CSS on the front end.
wp_dequeue_style( 'wp-block-library' );
// Remove Gutenberg theme.
wp_dequeue_style( 'wp-block-library-theme' );
// Remove inline global CSS on the front end.
wp_dequeue_style( 'global-styles' );
// Remove classic-themes CSS for backwards compatibility for button blocks.
wp_dequeue_style( 'classic-theme-styles' );
}, 20 );
The snippet does these the following things:
- Disable Gutenberg for posts on the back end
- Disable Gutenberg for widgets. It's very useful when you want to use the old widgets screen as before, and
- Remove Gutenberg's CSS file and inline styles on the front end. Without it, Gutenberg will enqueue an unnecessary CSS file and output huge inline styles in your website's
<head>. That will decrease your website performance and slow it down. - Remove the classic theme styles for backwards compatibility for button blocks.
If you want to disable Gutenberg for a specific post type, use the code below:
add_filter( 'use_block_editor_for_post_type', function( $enabled, $post_type ) {
return 'your_post_type' === $post_type ? false : $enabled;
}, 10, 2 );
Alternative ways to disable Gutenberg
There are other ways to disable Gutenberg that are suitable if you're not familiar with adding snippets to your theme. We recommend the plugin Falcon - an optimization plugin from us (eLightUp) to disable Gutenberg. It offers a lot of optimization tweaks like:
- Disable Gutenberg
- Disable emojis
- Cleanup the header
- Asynchronous load CSS
- Cleanup menu class
And much more. It's very lightweight and requires little configuration. Here is the plugin screenshot:
If you haven't used Falcon yet, we'd suggest trying it. It's simple, fast and very easy to use. Coded by us, so we guarantee about the coding quality and the performance.
In conclusion, we think disabling Gutenberg is a good way to write posts in WordPress. At Meta Box, we completely disable Gutenberg and all the related stuff with Falcon. It helps us have a better writing experience and not have to fix unpredictable bugs with the block editor. It also helps us have a better performance on the front end by removing unneccessary CSS, which is a pain point in optimizing the website for pagespeed.
An Update on WordPress 5.0, Gutenberg and Meta Box 
How to Disable Gutenberg and Use the WordPress Classic Editor 
Gutenberg and the Future of Meta Box
work it . thanks a lot
best regards and best wishes
thank sir. I have done it. and working 100%
Thank you. I really appreciate this.
Thanks for the tutorial. Was looking forward to just disabling Gutenberg for widgets. This will help.
Hello, I added this code, but for some reason, it brought down my website when I uploaded the amended functions.php into my file manager. I previously was using this code:
// disable for posts
add_filter('use_block_editor_for_post', '__return_false', 10);
// disable for post types
add_filter('use_block_editor_for_post_type', '__return_false', 10);
However, the code that I have just included doesn't work to prevent Gutenberg blocks from appearing in Widgets. Have you seen other instances of the code that you provided causing major website errors? Thank you in advance.