It can be relatively straightforward to make your simple content pages ready for Gutenberg, but complex pages are different.
Consider a modular homepage with complex full-width sections. While you could build many custom blocks to implement this (as I’ve done on my homepage), it might be easier and faster to use the metabox plugin you already know. We often build landing pages using ACF flexible content.
Using a plugin
The Classic Editor plugin is great for disabling Gutenberg site-wide, but is not a good choice for selectively using it on certain pages.
Gutenberg Ramp lets you disable Gutenberg on a per-post-type basis. You could use Gutenberg for posts, but keep the classic editor for pages.
Using a filter
We can use the use_block_editor_for_post_type filter for more fine-grained control. It passes two parameters:
$can_edit, boolean, whether Gutenberg should be used to edit$post_type, string
I use $_GET['post'] to get the current Page ID from the URL. If that page is using certain templates, I’ll disable the Gutenberg editor. I also use a similar function to remove the classic editor for current WordPress installs.
I create a disable-editor.php file in my theme and update the $excluded_templates and $excluded_ids arrays specify where I want the editor turned off.
This disables both the Gutenberg Block Editor and Classic Editor, allowing me to use a metabox for constructing the editing experience.
<?php
/**
* Disable Editor
*
* @package ClientName
* @author Bill Erickson
* @since 1.0.0
* @license GPL-2.0+
**/
/**
* Templates and Page IDs without editor
*
*/
function ea_disable_editor( $id = false ) {
$excluded_templates = array(
'templates/modules.php',
'templates/contact.php'
);
$excluded_ids = array(
// get_option( 'page_on_front' )
);
if( empty( $id ) )
return false;
$id = intval( $id );
$template = get_page_template_slug( $id );
return in_array( $id, $excluded_ids ) || in_array( $template, $excluded_templates );
}
/**
* Disable Gutenberg by template
*
*/
function ea_disable_gutenberg( $can_edit, $post_type ) {
if( ! ( is_admin() && !empty( $_GET['post'] ) ) )
return $can_edit;
if( ea_disable_editor( $_GET['post'] ) )
$can_edit = false;
return $can_edit;
}
add_filter( 'gutenberg_can_edit_post_type', 'ea_disable_gutenberg', 10, 2 );
add_filter( 'use_block_editor_for_post_type', 'ea_disable_gutenberg', 10, 2 );
/**
* Disable Classic Editor by template
*
*/
function ea_disable_classic_editor() {
$screen = get_current_screen();
if( 'page' !== $screen->id || ! isset( $_GET['post']) )
return;
if( ea_disable_editor( $_GET['post'] ) ) {
remove_post_type_support( 'page', 'editor' );
}
}
add_action( 'admin_head', 'ea_disable_classic_editor' );
Hermann LAHAMI says
Do you think that Gutemberg can one day make popular page builders such as VC, elementor and other obsolete? I’m really curious about it
Bill Erickson says
I believe Gutenberg will definitely have an effect on page builders. Many people turned to page builders because they were disappointed with the flexibility of TinyMCE, which Gutenberg is trying to fix.
But I think there will always be a role to play for page builders on top of (or instead of) Gutenberg. WordPress core won’t go as far with Gutenberg as the page builders have.
Paul Herrick says
It will affect the page builders.
As i am using Cosmic Blocks(WordPress 5.0 Gutenberg Blocks Collection) & it helped me a lot to add stunning animations to your blocks to make your website looks great.
https://cosmicwp.com/
Claire Coupland says
Hi. If i install your ‘Disable Gutenberg’ plugin BEFORE WordPress 5.0 rolls out, will it disable Gutenberg when v5.0 is installed?
Bill Erickson says
Yes it will. You can install it now, and once WP 5.0 is out it will automatically disable Gutenberg.
You can also install the Classic Editor plugin now. They’ve fixed the issues I described above.
Valentin Genev says
Thank you very much for this post, it works like a charm!
I’m using ACF (custom fields) for some of my templates and they mix better with the old editor’s page. Plus, I’ll be avoiding questions like “Why don’t we just use the block ‘Gallery’ from the plus in the top left corner of the window?”. 😀
I would love to buy you a coffee when I get my honorarium paid.
Ahmad says
Bill do you try this one
https://wordpress.org/plugins/disable-gutenberg-littlebizzy/
Bill Erickson says
No, I haven’t used that plugin before. I recommend sticking with the Classic Editor plugin since it’s the recommendation from WP core and will stay up-to-date with new Gutenberg changes.
Steven says
Is it possible to add some comments as to what the code is doing in each section? I’m not really sure how to add my templates to ignore, or specific post id or pages.
Bill Erickson says
The only code you need to modify is lines 17-24. That lets you specify a list of page templates and/or a list of post IDs to exclude.
The
ea_disable_editor()function determines if the current post should have the editor disabled, based on the IDs / templates you’ve set to exclude.That value (true/false) is then used by the two following two functions to disable the Gutenberg editor and the Classic editor for that post.
I built it this way so you have a single list to maintain rather than duplicating the list for Gutenberg and Classic.
Jon Schroeder says
Bill, I have a plugin which registers different ACF fields on different templates, some of which can use Gutenberg, and some of which can’t. I’ve been able to implement your (fantastic) example above to disable Gutenberg for one of those templates, that we’ll call “custom.”
Here’s the weird behavior that happens in the page editor:
I’m on a “custom” template page, with Gutenberg disabled. I change the page template from “custom” to “default”, then update. Gutenberg appears, everything’s great, looks perfect.
If I try to go the other direction though, changing my template from “default” to “custom,” then save, then Gutenberg stays present until I do a page refresh, and the ACF fields don’t automatically refresh either.
I figure this might be a situation you’ve come across before. Any tips?
Bill Erickson says
Yes, this is because Gutenberg updates without refreshing the page, while the classic editor did refresh it.
This approach only works when the page initially loads (it removes the editor on the admin_head hook). If the state of the document changes without reloading, our code never gets a chance to run again.
To fix this, you’d need to add JavaScript to the Gutenberg editor that monitors for a change in page template and reloads the page if the non-Gutenberg template is saved. You couldn’t just watch for the dropdown to change – you’d need to wait until the post is actually saved / updated to trigger your change.
I haven’t tried to build something like this, but if you do, please share the code here!
Allyson Souza says
Thanks for the post Bill! It’s exactly what we’re searching for here. We’re developing a custom theme for a company and there’s not too much reasons to make frontpage “block editable”, we just want to present some meta fields to make content editable, and that’s all.
J Ivy says
Bill,
This is great. I also added
$excluded_postypes = array(
‘post’
);
$postype = get_post_type($id);
and added
|| in_array( $postype, $excluded_postypes )
to the return disabling Gutenberg for all posts.
Thank you for always having great insights into WP.
Shane says
I’ve been trying to implement this but it doesn’t seem to want to work for me. Basically I want to disable Gutenberg on all pages except the “Default Template” page (or `page.php`). I am using the first and second functions along with the hooks you supplied in my functions.php file – I tried it inside my Site Namespace and outside and none of my pages were affected. I tried adding different templates to the $excluded_templates array and they also were not affected. I tried saving and updating the pages and they also did not change. I also tried using the Disable Gutenberg plugin, which worked, but it would not work with templates (again). I’m not sure why it is not working. Any insight or help is greatly appreciated (After tinkering I just copied verbatim the first and second functions and only changed the $excluded_templates part and still did not work for me).
Bill Erickson says
So you want to disable Gutenberg if any page template is used. In that case, I’d use this: https://gist.github.com/billerickson/7623a52c7fc66d63585c14e9503430e8#file-disable-editor-php-L23
That will disable Gutenberg if `_wp_page_template` is not empty (ie: a custom page template is used).
I just tested locally and it worked as expected. Create a disable-editor.php file in your theme and include that in functions.php.
If you’re having issues, it could be that your code is loading too late.
Shane says
Hi Bill, thanks for the reply. I will try this out and tinker with it, What I meant was, I have 5 custom templates, one of which utilizes the “page.php” file. For our custom templates, we want GB disabled, but for any page using “Default Template” as the template, we want GB enabled. Our custom templates do not use “page-*.php”, they use a lowercase version of the filename.
So I have “Home” as the template -> Gutenberg would be disabled.
If it’s using “Default Template” as the template -> do not disable Gutenberg.
Shane says
Hey again, I just tried your response and it works for what I was wanting; I saw “if any page template” in your answer and assumed it meant all templates period.
Now, any templates I make do apply the disable and the default template still uses Gutenberg, thank you very much for this and sorry for my confusion when reading your answer.