Limiting WordPress Gutenberg blocks

The default editor in WordPress is somewhat crude. It is just a single (WYSYWIG) text area. All content is added here. Of course you can extend WordPress with custom fields or meta boxes to provide a more structured way of putting content in. You can code them by hand. Or use some plugin to do it for you. But unfortunately there is no common way of doing this.

Another way to extend the editor is by using shortcodes, like [gallery id="123"] for the default WordPress image gallery. This has always felt as a hack to me. It is not very intuitive, because you have to know the shortcode and what options you can use.

Some functionality is lacking in the current editor that is often desired by users. Tables being one prominent example. And of course there are different ways of achieving this. Writing HTML, extending the TinyMCE editor, adding a plugin that uses a shortcode.

To improve the situation the WordPress community is working on a new editor experience called Gutenberg. The biggest change is the introduction of blocks. The content can be build up using different elements to build a page. For example an image, followed by a paragraph, a table, a paragraph and so on. Some might know this concept from other content management systems like Concrete5 or Typo3.

Gutenberg block inserter

The new editor will be part of the upcoming WordPress 5.0 release, but you can already use it by installing the Gutenberg plugin. It is not recommended to use it on production web sites, because it is still being worked on. But it will arrive pretty soon. As early as April this year, if everything goes according to plan.

This will introduce a lot of standard blocks. Especially the list of embeds is quite large. If you are working on a web site with strict guidelines, typical for a large (corporate) organisation, you might want to limit the selection.

This can be done by adding some code to the functions.php. You can define which blocks are allowed, so only these will be selectable (so called whitelisting). This has the advantage that new blocks will not show up, so you will not have to update the list every time new ones are introduced.


<?php
function my_gutenberg_blocks() {
  return array(
    'core/paragraph',
    'core/image',
    'core/gallery',
    'core/table',
  );
}
add_filter( 'allowed_block_types', 'my_gutenberg_blocks' );

Here is a list of the currently available block types.


core/shortcode
core/image
core/gallery
core/heading
core/quote
core/embed
core/list
core/separator
core/more
core/button
core/pullquote
core/table
core/preformatted
core/code
core/html
core/freeform
core/latest-posts
core/categories
core/cover-image
core/text-columns
core/verse
core/video
core/audio
core/block
core/paragraph

core-embed/twitter
core-embed/youtube
core-embed/facebook
core-embed/instagram
core-embed/wordpress
core-embed/soundcloud
core-embed/spotify
core-embed/flickr
core-embed/vimeo
core-embed/animoto
core-embed/cloudup
core-embed/collegehumor
core-embed/dailymotion
core-embed/funnyordie
core-embed/hulu
core-embed/imgur
core-embed/issuu
core-embed/kickstarter
core-embed/meetup-com
core-embed/mixcloud
core-embed/photobucket
core-embed/polldaddy
core-embed/reddit
core-embed/reverbnation
core-embed/screencast
core-embed/scribd
core-embed/slideshare
core-embed/smugmug
core-embed/speaker
core-embed/ted
core-embed/tumblr
core-embed/videopress
core-embed/wordpress-tv

If you want to know more, you can read about the extensibility of Gutenberg in the already available documentation. So install the Gutenberg plugin and get your feet wet.