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 inline styles in your website's <head>. Here is a screenshot:
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' );
}, 20 );
The snippet does these 3 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.
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. Two popular plugins are Disable Gutenberg and Classic Editor. However, both plugins don't remove global inline styles that were added in WordPress 5.9. So, in our opinion, using the snippet above gives the best result!
- Gutenberg and the Future of Meta Box
- How to Disable Gutenberg and Use the WordPress Classic Editor
- Meta Box is Now Compatible with Gutenberg
- An Update on WordPress 5.0, Gutenberg and Meta Box
- How To Disable Gutenberg Without Using Plugins
- Introducing MB Blocks - Creating Gutenberg Blocks Now Made Easy
- Build Gutenberg Blocks Visually With Meta Box Builder
- Top 7 Plugins to Add Extra Blocks for Gutenberg [2021]
- Full Site Editing (FSE) - All You Need To Know - P1 - Overview
- Gutenberg vs. Page Builders - What is Better & Faster? In-depth Comparison
- Review Quadrat - A WordPress Block Theme
- Full Site Editing - P5: What Are Block Patterns in Gutenberg? How to Create Them?
Update: UI for the Frontend Submission Form 
How to Create a Product Page - P5 - Using Meta Box and Gutenberg 
How to Display Opening Hours for Restaurants - P1 - Using Meta Box + Gutenberg
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.