Я хочу создать блок с редактируемыми полями, но не могу понять, почему я получаю эту ошибку: 'Ваш сайт не поддерживает блок.Вы можете оставить этот блок нетронутым, преобразовать его содержимое в пользовательский HTML-блок или полностью удалить его ». Кто-нибудь знает, что может вызвать такую ошибку?Я что-то не так делаю?
Код PHP:
function protex_contact_gutenberg_block_enqueue_scripts(){
$required_js_files = array(
'wp-blocks',
'wp-i18n',
'wp-element',
'wp-editor'
);
wp_enqueue_script( 'react', 'https://unpkg.com/react@16/umd/react.development.js', $required_js_files );
$required_js_files[] = 'react';
wp_enqueue_script( 'react-dom', 'https://unpkg.com/react-dom@16/umd/react-dom.development.js', $required_js_files );
wp_enqueue_script( 'babel', 'https://unpkg.com/babel-standalone@6/babel.min.js', $required_js_files );
$required_js_files[] = 'babel';
wp_register_script( 'protex_contact_gutenberg_block_gutenberg_js', plugin_dir_url( __FILE__ ) . 'assets/prtx_contact.js', $required_js_files );
register_block_type('protex-contact/block', array(
'editor_script' => 'protex_contact_gutenberg_block_gutenberg_js',
'editor_script' => 'babel',
'editor_script' => 'react',
'editor_script' => 'react-dom',
));
}
add_action( 'init', 'protex_contact_gutenberg_block_enqueue_scripts' );
function protex_contact_gutenberg_block_gutenberg_modify_jsx_tag( $tag, $handle, $src ) {
if ( 'my_custom_gutenberg_block_gutenberg_js' == $handle ) {
$tag = str_replace( "<script type='text/javascript'", "<script type='text/babel'", $tag );
}
return $tag;
}
add_filter( 'script_loader_tag', 'protex_contact_gutenberg_block_gutenberg_modify_jsx_tag', 10, 3 );
Код JS:
const { __ } = wp.i18n;
const { registerBlockType } = wp.blocks;
const { RichText } = wp.editor;
registerBlockType( 'protex-contact/block', {
title: __( 'Protex konakt', 'protex-contact' ),
icon: 'id',
category: 'common',
attributes: {
content: {
type: 'string',
source: 'html',
selector: 'p',
},
},
edit({ attributes, className, setAttributes }) {
const { content } = attributes;
function onChangeContent( newContent ) {
setAttributes( { content: newContent } );
}
return (
<div className={ className }>
<RichText
tagName="p"
className="prtx_contact_input"
value={ content }
onChange={ onChangeContent } />
</div>
);
},
save({ attributes }) {
let { content } = attributes;
return (
<RichText.Content
tagName="p"
value={ content }
/>
);
},
} );