Disabling the Gutenberg Editor in WordPress 5

Disabling the Gutenberg Editor in WordPress 5

Various reasons exist why WordPress users might want to disable the Gutenberg Editor. Here we show various methods to disabling the Gutenberg Editor in WordPress.

Introduction

Most WordPress users are happy with regular updates on their favourite content management website software. For me, a striking difference, starting at WordPress 5, was the Gutenberg Editor instead of the, now, ‘Classic Editor’. Without going into too much of a discussion, this post will show how to disable the Gutenberg Editor in WordPress.

Introduction to the Gutenberg Editor

The, now default, Gutenberg Editor (replacing the TinyMCE aka the ‘Classic Editor’) is said to pave the way forward for WordPress in more ways than just a WordPress editor.

With its block layout (hence ‘Block Editor’), Gutenberg is paving the way for page templates by turning WordPress into a full site customiser. This sounds very exciting for the future of WordPress and will make layouts easier for new websites (and new users).

Even so, Gutenberg is still in its early development and there are still a lot of issues that need to be addressed. Not everyone is a fan of Gutenberg (maybe, yet). Fortunately, the Classic Editor is still available for the time being (said to be until 31 December 2021).

Disabling the Gutenberg Editor

The Gutenberg Editor for WordPress can be disabled in various ways. They include using WordPress PHP filters in the (child) theme’s functions.php file or using plugins.

Disable the Gutenberg Editor using the functions.php

For established WordPress users, the simplest, and cleanest, way to disable the Gutenberg Editor (and continue using the Classic Editor) is by adding the following pieces of code to the (child) theme’s functions.php file:

// Disable Gutenberg Editor
add_filter( 'use_block_editor_for_post', '__return_false' );
add_filter( 'use_block_editor_for_post_type', '__return_false' );

To start off, the Gutenberg Editor can be disabled by filtering '__return_false' through the use_block_editor_for_post and use_block_editor_for_post_type functions.

In my experience, the code above is the minimum that is required to disable the Gutenberg Editor and will get rid of the elephant in the room. Even if this is so, more thorough developers will still notice the block editor CSS library stylesheets situated in the <head> section of page requests:

<link rel="stylesheet" id="wp-block-library-css" href="https://behind-the-scenes.net/wp-includes/css/dist/block-library/style.min.css" type="text/css" media="all">

Some plugins, such as Toolset and WooCommerce, might also add their own block editor stylesheets.

To remove the WordPress core block editor CSS library from the <head> section, the following code can be used:

function bts_remove_wp_block_library_css() {
  wp_dequeue_style( 'wp-block-library' ); // WordPress core
  wp_dequeue_style( 'wp-block-library-theme' ); // WordPress core
  wp_dequeue_style( 'wc-block-style' ); // WooCommerce block CSS
  wp_dequeue_style( 'toolset_blocks-style-css' ); // Toolset block CSS
}
add_action( 'wp_enqueue_scripts', 'bts_remove_wp_block_library_css', 100 ); // in some cases a higher priority (e.g.200) is more effective.

Disable the Gutenberg Editor using plugins

For less advanced WordPress users, or a more robust and most up-to-date solution, the Gutenberg Editor can be disabled using the Classic Editor plugin or the Disable Gutenberg plugin.

Both these plugins are back-end plugins and worked well out of the box.

Classic Editor plugin

WordPress Classic Editor plugin

WordPress Classic Editor plugin.

At the time of writing the Classic Editor plugin had more than 900 000 active installs and an average rating of 4.9 out of 5.

Because Gutenberg saves its markup in HTML, you can still roll back to the Classic Editor even after using the Gutenberg Editor.

The Classic Editor plugin can be installed from the WordPress plugins section or downloaded from WordPress.org and extracted or uploaded to the plugins folder. It should start to work immediately after its activation.

Disable Gutenberg plugin

Disable Gutenberg plugin

WordPress Disable Gutenberg plugin.

At the time of writing the Disable Gutenberg plugin had more than 30 000 active installs and an average rating of 5 out of 5.

According to its author, this plugin will not expire when TinyMCE support expires for WordPress.

In addition to deactivating the Gutenberg Editor, this plugin provides options to enable Gutenberg on specific post types, user roles, and more.

The Disable Gutenberg plugin can be installed from the WordPress plugins section or downloaded from WordPress.org and extracted or uploaded to the plugins folder. It should start to work immediately after its activation.

Background

WordPress Gutenberg Editor header

The official WordPress Gutenberg Editor plugin header.

Prior to WordPress 5.0, the Gutenberg Editor was available as a plugin from WordPress.org.

WordPress Gutenberg Editor plugin

Even after all the hype, the plugin wasn’t received well by users but has a lot of active installs. Looking at the plugin and WordPress correspondence, the future of Gutenberg should be bright — once all the kinks have been sorted out.

Conclusion

Not everyone is a fan of the new Genberg Editor for WordPress. To continue using the, now, Classic Editor, the Gutenberg Editor can be temporarily disabled.

The Gutenberg Editor for WordPress can be disabled by modifying a (child) theme’s functions.php file or by using plugins. Well-supported plugins include the Classic Editor plugin or the Disable Gutenberg plugin.

Leave a Reply

Your email address will not be published. Required fields are marked *