Disable Gutenberg Blocks

Originally published at: Disable Gutenberg Blocks

Once I decided to use Gutenberg editor for my websites I faced with is the huge amount of default blocks, which is cool of course, but I’m such a minimalist.

In this tutorial I am going to show several ways how you can hide or completely restrict the usage of specific blocks on your website.

Gutenberg Block Manager

In this method we are not going to do any coding yet. This method was not possible before but in WordPress 5.2 the Block Manager was introduced – it is a build-in feature that allows you to turn off or turn on specific blocks on your website, at the moment of writing this article it is located in Preferences > Blocks. Very cool especially if you are not really into coding.

This is how it works:

You can turn off the whole block groups here.

But of course if you develop a custom theme and it shouldn’t support a certain block, you’d better deactivate the blocks via code and we are going to talk about in just a little bit.

Disable Gutenberg Blocks in Code

Using allowed_block_types_all to whitelist blocks

Or allowed_block_types, depends on your WordPress version. I mean we used allowed_block_types before but then it became deprecated in WordPress 5.8 and now we have to use allowed_block_types_all filter.

So, using filter hook allowed_block_types_all we can whitelist some specific blocks, that we are going to allow to use on the website. Check the example below, where we are going to hide all the blocks except Paragraph, Heading, Image and List blocks.

/*
 * Whitelist specific Gutenberg blocks (paragraph, heading, image and lists)
 *
 * @author Misha Rudrastyh
 * @link https://rudrastyh.com/gutenberg/remove-default-blocks.html#allowed_block_types_all
 */
add_filter( 'allowed_block_types_all', 'misha_allowed_block_types', 25, 2 );

function misha_allowed_block_types( $allowed_blocks, $editor_context ) {

<span class="token keyword">return</span> <span class="token keyword">array</span><span class="token punctuation">(</span>
	<span class="token string single-quoted-string">'core/image'</span><span class="token punctuation">,</span>
	<span class="token string single-quoted-string">'core/paragraph'</span><span class="token punctuation">,</span>
	<span class="token string single-quoted-string">'core/heading'</span><span class="token punctuation">,</span>
	<span class="token string single-quoted-string">'core/list'</span>
<span class="token punctuation">)</span><span class="token punctuation">;</span>

}

Once you insert this code to your current theme functions.php file, you would have this:

Now we only have blocks here that are listed in allowed_block_types_all filter.

A couple notes related to this code snippet

  • You might ask – but how to find out block slugs for the filter? If you try print_r( $allowed_blocks ), it returns nothing. Why? Because by default the allowed blocks array is empty, which means to display all blocks. If we add something to this array, only the blocks from the array will be displayed. To make it easier for you I decided to mention all the default blocks in the next chapter of this tutorial.
  • The filter also have $editor_context argument available, it contains the information about the admin page where the Block Editor is currently running. Using this argument we are going to add some post type related conditions later.

If you decide to use allowed_block_types_all filter, keep in mind, that neither plugins or themes will be able to add custom blocks! Here I described how to deal with that.

List of Gutenberg blocks

To make it more clear, I split the core blocks list by categories.

Text category:

Block slug Block name
core/paragraph Paragraph
core/heading Heading
core/list List
core/preformatted Preformatted
core/pullquote Pullquote
core/table Table
core/verse Verse

Media category:

Block slug Block name
core/image Image
core/gallery Gallery
core/audio Audio
core/cover Cover
core/file File
core/media-text Media & Text
core/video Video

Design category:

Block slug Block name
core/buttons Buttons
core/columns Columns
core/group Group
core/row Row
core/stack Stack
core/more More
core/nextpage Page Break
core/separator Separator
core/spacer Spacer

Widgets category:

Block slug Block name
core/archives Archive
core/calendar Calendar
core/categories Categories
core/html Custom HTML
core/latest-comments Latest Comments
core/latest-posts Latest Posts
core/page-list Page List
core/rss RSS
core/search Search
core/shortcode Shortcode
core/social-links Social Icons
core/tag-cloud Tag Cloud

Theme category:

Block slug Block name
core/navigation Navigation
core/site-logo Site Logo
core/site-title Site Title
core/site-tagline Site Tagline
core/query Query Loop
core/posts-list Posts List
core/avatar Avatar
core/post-title Post Title
core/post-excerpt Post Excerpt
core/post-featured-image Post Featured Image
core/post-content Post Content
core/post-author Post Author
core/post-date Post Date
core/post-terms Post Categories,
Post Tags
core/post-navigation-link Next post,
Previous post
core/read-more Read More
core/comments-query-loop Comments Query Loop
core/post-comments-form Post Comments Form
core/loginout Login/out
core/term-description Term Description
core/query-title Archive Title
core/post-author-biography Post Author Biography

Embeds category:

Block slug Block name
core/embed Embed, Twitter, Youtube, WordPress, Soundcloud, Spotify, Flickr, Vimeo, Animoto, Cloudup, Crowdsignal, Dailymotion, Imgur, Issuu, Kickstarter, Mixcloud, Reddit, ReverbNation, Screencast, Scribd, Slideshare, SmugMug, Speaker Desc, TikTok, Videopress, WordPress.tv, Amazon Kindle, Pinterest, Wolfram

Allow or Disallow Blocks for Specific Post Types

Do you remember, I mentioned that allowed_block_types_all hook accepts $editor_context parameter? Let’s use it now! For example, we will add one more block – Shortcode for Pages. In this case our code will be changed a little bit:

add_filter( 'allowed_block_types_all', 'misha_allowed_block_types', 25, 2 );

function misha_allowed_block_types( $allowed_blocks, $editor_context ) {

<span class="token variable">$allowed_blocks</span> <span class="token operator">=</span> <span class="token keyword">array</span><span class="token punctuation">(</span>
	<span class="token string single-quoted-string">'core/image'</span><span class="token punctuation">,</span>
	<span class="token string single-quoted-string">'core/paragraph'</span><span class="token punctuation">,</span>
	<span class="token string single-quoted-string">'core/heading'</span><span class="token punctuation">,</span>
	<span class="token string single-quoted-string">'core/list'</span>
<span class="token punctuation">)</span><span class="token punctuation">;</span>

<span class="token keyword">if</span><span class="token punctuation">(</span> <span class="token string single-quoted-string">'page'</span> <span class="token operator">===</span> <span class="token variable">$editor_context</span><span class="token operator">-&gt;</span><span class="token property">post</span><span class="token operator">-&gt;</span><span class="token property">post_type</span> <span class="token punctuation">)</span> <span class="token punctuation">{</span>
	<span class="token variable">$allowed_blocks</span><span class="token punctuation">[</span><span class="token punctuation">]</span> <span class="token operator">=</span> <span class="token string single-quoted-string">'core/shortcode'</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>

<span class="token keyword">return</span> <span class="token variable">$allowed_blocks</span><span class="token punctuation">;</span>

}

In this code snippet we get post type from a WP_Post object, it is located, as you’ve probably guessed, in $editor_context->post. So, you can even allow or disallow specific blocks by the post ID!

Here is my result for Pages:

How to Blacklist Specific Blocks?

In the examples above we used more like a whitelist solution. So we can specify specific blocks to whitelist – all the other blocks are going to be disabled. Like without exception at all. It means that not a single plugin that extends Gutenberg editor with blocks is going to do anything. And if you decide to create a custom block it won’t appear in inserter until you add it to whitelist.

So whitelisting doesn’t seem like a flexible solution and that’s why I decided to cover a blacklisting topic here as well.

We can blacklist any block with the same allowed_block_types_all, but we will also need the list of all the registered blocks. WP_Block_Type_Registry::get_instance()->get_all_registered() will help us with that.

Check this code out:

$registered_block_slugs = array_keys( WP_Block_Type_Registry::get_instance()->get_all_registered() );

echo ‘<pre>’ . print_r( $registered_block_slugs, true ) . ‘</pre>’;

/*
Array
(
[0] => core/archives
[1] => core/avatar
[2] => core/block
[3] => core/calendar
[4] => core/categories

 ... and so on

*/

Ok, let’s say that you don’t need Archives and Calendar blocks.

/*
 * Blacklist specific Gutenberg blocks
 *
 * @author Misha Rudrastyh
 * @link https://rudrastyh.com/gutenberg/remove-default-blocks.html#blacklist-blocks
 */
add_filter( 'allowed_block_types_all', 'misha_blacklist_blocks' );

function misha_blacklist_blocks( $allowed_blocks ) {
// get all the registered blocks
$blocks = WP_Block_Type_Registry::get_instance()->get_all_registered();

<span class="token comment">// then disable some of them</span>
<span class="token keyword">unset</span><span class="token punctuation">(</span> <span class="token variable">$blocks</span><span class="token punctuation">[</span> <span class="token string single-quoted-string">'core/archives'</span> <span class="token punctuation">]</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">unset</span><span class="token punctuation">(</span> <span class="token variable">$blocks</span><span class="token punctuation">[</span> <span class="token string single-quoted-string">'core/calendar'</span> <span class="token punctuation">]</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>

<span class="token comment">// return the new list of allowed blocks</span>
<span class="token keyword">return</span> <span class="token function">array_keys</span><span class="token punctuation">(</span> <span class="token variable">$blocks</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>

}

Do not forget to check the comments section below for more useful examples.