Get Gutenberg reusable blocks outside the Block Editor

Did you know that Gutenberg Reusable Blocks are stored as a bundled Post Type in WordPress database? Yep they are. You can even access them on the Reusable Blocks hidden admin screen available in example.com/wp-admin/edit.php?post_type=wp_block.

If Reusable Blocks are registered as a post type, then they are queryable as well as any post type in WordPress.

So we could easily get them outside of the editor…

Yeah! Looks great, let’s build some cool stuff!

Introducing get_reusable_block PHP function

This function will only get the formatted HTML content of a given Reusable block ID and return it.

Note: I’m prefixing the function with advent_ for the sake of WordPress Coding Standards ?

function advent_get_reusable_block( $block_id = '' ) {
	if ( empty( $block_id ) || (int) $block_id !== $block_id ) {
		return;
	}
	$content = get_post_field( 'post_content', $block_id );
	return apply_filters( 'the_content', $content );
}

So we can easily get any reusable block content by providing its ID. The following snippet will use get_reusable_block() function to display this block outside the editor (in your footer for example):

echo advent_get_reusable_block( 57 );

Example of advanced use: build a Reusable block shortcode

It’s quite easy to build a custom shortcode using our previous get_reusable_block function:

function advent_reusable_block_shortcode( $atts ) {
	extract( shortcode_atts( array(
		'id' => '',
	), $atts ) );
	if ( empty( $id ) || (int) $id !== $id ) {
		return;
	}
	$content = advent_get_reusable_block( $id );
	return $content;
}
add_shortcode( 'reusable', 'advent_reusable_block_shortcode' );

We now have a brand new shortcode, which can be easily used to display reusable block even in places where the block editor is not available!

[reusable id="57"]

Use cases for this shortcode are various:

• Custom Post Types without Block Editor enabled (so they are in Classic Editor mode)
• Text Widget (so reusable blocks can be added in your footer or in your sidebar)
• Advanced Custom Field (ACF) WYSIWYG editor field
• Gravity form confirmation message (the message that is displayed to users after filling the form)
• And even on… websites with Classic Editor plugin! So you can use Gutenberg Reusable Blocks without having it in any of your Custom Post Types, lol ?

Here is a plugin that is using this snippet. It also provide a Reusable Block Widget and in provides an extended admin interface to manage and preview reusable blocks:

Merry Christmas, lovely WordPress people! ?