How to enable Gutenberg for custom post type

ACPT 28 Dec 2021 0
How to enable Gutenberg for custom post type

Gutenberg is the block based editor introduced in WordPress 5. It replaces the classic WordPress editor which is built on TinyMCE.

With Gutenberg, you can add multiple media types and arrange the layout within the editor using blocks.

Some people have really fallen in love with it, some hate it.

Personally, I like it, it’s so powerful even if sometimes it’s a little bit messy.

Is it possible to use Gutenberg in custom post types?

Yes, we can actually use Gutenberg as the default editor for the registered custom post types in our theme.

For Gutenberg to work in a Custom Post Type you need just two things:

  • enable the editor in supports 
  • add 'show_in_rest' => true to your post registration arguments array.

Add this code to your theme functions.php file to register a Portfolio CPT:

/*Register WordPress  Gutenberg CPT */
function cw_post_type() {

    register_post_type( 'portfolio',
        // WordPress CPT Options Start
        array(
            'labels' => array(
                'name' => __( 'Portfolio' ),
                'singular_name' => __( 'Portfolio' )
            ),
            'has_archive' => true,
            'public' => true,
            'rewrite' => ['slug' => 'portfolio'],
            'show_in_rest' => true,
            'supports' => ['editor']
        )
    );
}

add_action( 'init', 'cw_post_type' );

But why does the show_in_rest parameter need to be enabled to use Gutenberg?

As we can read in WordPress official documentation:

The REST API can create routes for custom post types and custom taxonomies inside of the wp/v2 namespace, using the same controllers as the default post type or taxonomy term controllers. 

In other words, enabling show_in_rest parameter tells to WordPress to use the new REST API v2. something like that:

/wp-json/wp/v2/posts/394?locale=user

Gutenberg is built on top of these new endpoints and uses them to grab post data.

How to enable Gutenberg with ACPT

Pretty easy stuff. When registering a new CPT we have to pay attention to Step1 and Step3.

  • STEP 1 – Keep the attribute editor enabled inside the Editor checkbox list
  • STEP 3 – Keep the show_in_rest parameter enabled

As you may notice with ACPT default settings are both enabled.

How to turn back to TinyMCE Editor?

Just keep the attribute editor enabled and disable show_in_rest parameter.

Do I need to enable Gutenberg for my custom post types?

Well, this is totally up to you.

WordPress gives you the choice between Gutenberg and the classic TinyMCE. Both are excellent tools.

But keep in mind that WordPress developers, since version 5, are strongly relying on Gutenberg editor.

The future of WordPress is full-site editing through the block editor.

Comments

There are no comments yet

Please Post Your Comments & Reviews

20% Discount!


Use this code during check-out:

ACPT_2024_PROMO_20

Valid for all products*

*This coupon code is valid for all products and plans. The promotion expires December, 31st 2024 00:00:00 UTC

This will close in 20 seconds