How to disable fullscreen mode in Gutenberg WordPress Editor

WordPress 5.4 introduced fullscreen mode as default for the Gutenberg editor. That means every time you open a post or page, it is shown as fullscreen without your WordPress Admin Menu or Bar.

While this distraction-free mode can be useful in some cases, some users may find it confusing and want to go back to the regular view. This post will explain how to disable this.

How to easily disable fullscreen mode by default

To turn this off, simply edit a post or page and click on the three dots at the top-right corner of the screen. From here you can see there is a tick beside Fullscreen Mode, click it to deactivate. It will now return to normal.

This change applies only to you, the current user. WordPress will store this preference in your browser’s temporary storage. However Safari browser users will experience a reset of default settings once in a while because Safari periodically deletes local storage entries. The WordPress core developers are discussing the best method to check user preferences for a future release.

How to permanently disable fullscreen mode by default

You can permanently disable this feature by using the Blockeditor Fullscreen Mode Control plugin by Clorith.

If you don’t want to use a plugin, you can also disable this feature by adding the following snippet by Jean-Baptiset to your functions.php file or via a plugin like Custom Code Snippets.

if (is_admin()) { 
	function jba_disable_editor_fullscreen_by_default() {
	    $script = "jQuery( window ).load(function() { const isFullscreenMode = wp.data.select( 'core/edit-post' ).isFeatureActive( 'fullscreenMode' ); if ( isFullscreenMode ) { wp.data.dispatch( 'core/edit-post' ).toggleFeature( 'fullscreenMode' ); } });";
	    wp_add_inline_script( 'wp-blocks', $script );
	}
	add_action( 'enqueue_block_editor_assets', 'jba_disable_editor_fullscreen_by_default' );
}

This code checks if a user is viewing an admin area page. If they are and the fullscreen editor is enabled, it turns it off by default. But you can still manually turn it on in the editor screen.

Other view modes with Gutenberg

You can click the three dots again to choose Top Toolbar or Spotlight mode.

  • With Top Toolbar activated, your block options will be placed at the top of your screen instead of on top of each block.
  • With Spotlight mode activated, you can focus on one block at a time while everything else is dimmed.
Buy me a coffeeBuy me a coffee