1

I have a problem with my Gutenberg custom block. Alone, it works perfectly on every page or post. But, when I want to add this block, which is set to be dynamic, to a custom post type, it says "This block has encountered an error and cannot be previewed.". What can be a problem to do this? Code is given here. Thank you in advance.

plugin.php - defining Gutenberg custom block

function movieFavQuote() {
  wp_enqueue_script(
    'favquote-handler',
    plugin_dir_url(__FILE__) . 'quote-block.js',
    array('wp-blocks', 'wp-i18n', 'wp-editor'),
    true
  );
}
 
add_action('enqueue_block_editor_assets', 'movieFavQuote');

function favQuoteMeta() {
  register_meta('post', 'content', array('show_in_rest' => true, 'type' => 'string', 'single' => true));
}

add_action('init', 'favQuoteMeta');

quote-block.js - defining Gutenberg custom block

wp.blocks.registerBlockType('pavle/movie-quote', {
    title: 'Favourite movie quote',
    icon: "smiley",
    category: "common",
    attributes: {
        content: {type: 'string', source: 'meta', meta: 'content'}
    },

    edit: function(props) {
        function updateContent(event) {
        props.setAttributes({content: event.target.value})
        }

        return wp.element.createElement(
            "div",
            null,
            wp.element.createElement("h3", null, " Favourite movie quote: "),
            wp.element.createElement("input", {
              type: "text",
              value: props.attributes.content,
              onChange: updateContent
            })
          );
    },
    save: function(props) {
        return wp.element.createElement("h2", null, " Favourite movie quote:", props.attributes.content);
    }
})

movies.php - custom post type defining

<?php

    function movie_cpt() {
    
            $labels = array(
    'name'                  => _x( 'Movies', 'Post Type General Name', 'text_domain' ),
    'singular_name'         => _x( 'Movie', 'Post Type Singular Name', 'text_domain' ),
    'menu_name'             => __( 'Movies', 'text_domain' ),
    'name_admin_bar'        => __( 'Movies', 'text_domain' ),
    'archives'              => __( 'Movie Archive', 'text_domain' ),
    'attributes'            => __( 'Item Attributes', 'text_domain' ),
    'parent_item_colon'     => __( 'Parent Item:', 'text_domain' ),
    'all_items'             => __( 'All Movies', 'text_domain' ),
    'add_new_item'          => __( 'Add New Movie', 'text_domain' ),
    'add_new'               => __( 'Add New Movie', 'text_domain' ),
    'new_item'              => __( 'New Movie', 'text_domain' ),
    'edit_item'             => __( 'Edit Movie', 'text_domain' ),
    'update_item'           => __( 'Update Movie', 'text_domain' ),
    'view_item'             => __( 'View Movie', 'text_domain' ),
    'view_items'            => __( 'View Movie', 'text_domain' ),
    'search_items'          => __( 'Search Movies', 'text_domain' ),
    'not_found'             => __( 'Movie not Found', 'text_domain' ),
    'not_found_in_trash'    => __( 'Movie not Found in Trash', 'text_domain' ),
    'featured_image'        => __( 'Featured Image', 'text_domain' ),
    'set_featured_image'    => __( 'Set featured image', 'text_domain' ),
    'remove_featured_image' => __( 'Remove featured image', 'text_domain' ),
    'use_featured_image'    => __( 'Use as featured image', 'text_domain' ),
    'insert_into_item'      => __( 'Insert into item', 'text_domain' ),
    'uploaded_to_this_item' => __( 'Uploaded to this item', 'text_domain' ),
    'items_list'            => __( 'Movie List', 'text_domain' ),
    'items_list_navigation' => __( 'Items list navigation', 'text_domain' ),
    'filter_items_list'     => __( 'Filter items list', 'text_domain' ),
);
$args = array(
    'label'                 => __( 'Movie', 'text_domain' ),
    'description'           => __( 'Post Type Description', 'text_domain' ),
    'labels'                => $labels,
    'supports'              => array( 'title', 'editor'),
    'taxonomies'            => array( 'category', 'post_tag' ),
    'hierarchical'          => false,
    'public'                => true,
    'show_ui'               => true,
    'show_in_menu'          => true,
    'menu_position'         => 5,
    'show_in_admin_bar'     => true,
    'show_in_nav_menus'     => true,
    'can_export'            => true,
    'has_archive'           => true,
    'exclude_from_search'   => false,
    'publicly_queryable'    => true,
    'capability_type'       => 'page',
    'show_in_rest'          => true,
    'register_meta_box_cb'  => 'movie_meta_box'
);
        register_post_type( 'movie', $args );
    
    }
    add_action( 'init', 'movie_cpt');
        
    function movie_meta_box() {
            add_meta_box(
                'movie-title',
                __('Movie Title', 'sitepoint'),
                'movie_title_meta_box_callback',
            );
    }
    
    add_action('add_meta_boxes_movie', 'movie_meta_box');
    
    function movie_title_meta_box_callback($post) {
        wp_nonce_field('movie_title_nonce', 'movie_title_nonce');
        $value = get_post_meta($post->ID, '_movie_title', true);
        echo '<textarea style = "width:100%" id="movie_title" name="movie_title">' . esc_attr( $value ) . '</textarea>';
    }
    function save_movie_title_meta_box_data($post_id) {
        if (!isset($_POST['movie_title_nonce'])) {
            return;
        }
        if(!wp_verify_nonce( $_POST['movie_title_nonce'], 'movie_title_nonce' )) {
            return;
        }
        if(defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
            return;
        }
        if(isset($_POST['post_type']) && 'page' == $_POST['post_type']) {
            if ( ! current_user_can( 'edit_page', $post_id ) ) {
                return;
            }
        }
        else {
            if ( ! current_user_can( 'edit_post', $post_id ) ) {
                return;
            }
        }
        if(!isset($_POST['movie_title'])) { 
            return; 
        }
        $my_data = sanitize_text_field( $_POST['movie_title'] );
        update_post_meta( $post_id, '_movie_title', $my_data );
    }
    
    add_action('save_post', 'save_movie_title_meta_box_data');
7
  • What do you mean by "when I want to add this block, which is set to be dynamic, to a custom post type"? Can you please explain more? Commented Dec 5, 2022 at 12:22
  • @KrunalBhimajiyani When I open Add new page/post and want to add this gutenberg block, everything is ok, both on front and backend. When I tru to add this block to custom-post Movies, there is a message "This block has encountered an error and cannot be previewed." I don't know why on a normal post or page there is no problem, but in custom post type there is a problem. Commented Dec 5, 2022 at 12:26
  • It is working fine for custom post types too. I have tried in my local. Commented Dec 5, 2022 at 12:29
  • Then it must work on my local, too, but I really don't know the problem. Maybe to deactivate/activate the Movies plugin? Edit: again not working. Commented Dec 5, 2022 at 12:31
  • Can you please add the labels and args of your post type? Commented Dec 5, 2022 at 12:44

1 Answer 1

0

Try adding custom-fields to the support array;

'supports'  => [
        'title',
        'editor',
        'thumbnail',
        'custom-fields'
    ],

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.