Search code examples
phpwordpresswordpress-gutenberggutenberg-blocksacfpro

WordPress Gutenberg - White Screen on page edit screen using custom block category in template


I'm attempting to setup a template and use a block that is contained within a custom category. The blocks word a-ok when used normally in the Gutenberg editor.

I create the category as such:

add_filter( 'block_categories', function( $categories, $post ) {
 return array_merge(
   $categories,
   array(
     array(
       'slug'  => 'mycustomcat',
       'title' => 'My Custom Category',
     ),
   )
 );
}, 10, 2 );

And make an (ACF) block:

    acf_register_block_type(array(
        'name'              => 'column-text',
        'title'             => __('Column Text'),
        'render_template'   => 'template-parts/blocks/column-text-block.php',
        'category'          => 'mycustomcat',
        'icon'              => 'menu-alt2',
        'keywords'          => array( 'column', 'text' ),
        'post_types'        => $supportedPostTypes,
        'mode'              => 'auto',
        'supports'          => array( 'align' => false ),
    ));

All is good until we get here:

function myplugin_register_template() {
   $post_type_object = get_post_type_object( 'page' );
   $post_type_object->template = array(
       array( 'mycustomcat/column-text' ),
   );
}
add_action( 'init', 'myplugin_register_template' );

Then, when creating new page in the WordPress admin I get a blank white screen. The only error found is in console:

Uncaught (in promise) TypeError: Cannot read property 'attributes' of undefined
    at Te (blocks.min.js?ver=6.7.2:2)
    at blocks.min.js?ver=6.7.2:2
    at c (lodash.min.js?ver=4.17.15:6)
    at ru (lodash.min.js?ver=4.17.15:67)
    at pn (blocks.min.js?ver=6.7.2:2)
    at editor.min.js?ver=9.7.5:11
    at u (editor.min.js?ver=9.7.5:11)
    at Generator._invoke (editor.min.js?ver=9.7.5:11)
    at Generator.forEach.e.<computed> [as next] (editor.min.js?ver=9.7.5:11)
    at redux-routine.min.js?ver=3.6.2:1

Solution

  • For others having the same problem. The Acf block names have to be namespaced with acf/blockname.

    In this case array( 'mycustomcat/column-text' ) should be array( 'acf/column-text' ).