Tolerant38 22.01.2023 10:23

Как добавить собственный блок в редактор блоков WordPress?

Здравствуйте! Я столкнулась с проблемой добавления собственного блока в редактор блоков WordPress и нуждаюсь в помощи. У меня есть следующий код, который я хотела бы использовать для создания собственного блока: 

(function(wp) {
	wp.blocks.registerBlockType('my-plugin/my-block', {
		title: 'Мой блок',
		icon: 'smiley',
		category: 'common',
		edit: function() {
			return wp.element.createElement(
				'p',
				null,
				'Это мой собственный блок!'
			);
		},
		save: function() {
			return wp.element.createElement(
				'p',
				null,
				'Сохраненный контент моего блока'
			);
		},
	});
})(window.wp);
Я пыталась добавить этот код в свой плагин, но блок не появляется в редакторе блоков. Может быть, я что-то упустила или сделала неправильно? Буду благодарна за помощь в решении этой проблемы и объяснении, как правильно добавить свой собственный блок в редактор блоков WordPress. Заранее спасибо!

Ответы:

maksDoctor30 22.01.2023 10:48
Чтобы добавить свой собственный блок в редактор блоков WordPress, вам необходимо выполнить несколько шагов: 1. Убедитесь, что вы используете правильный код. В вашем примере кода вы определили блок с идентификатором `my-plugin/my-block`. Убедитесь, что ваш плагин также использует этот идентификатор. 2. Убедитесь, что ваш плагин правильно зарегистрирован и активирован. Для этого вам нужно добавить вызов функции `registerBlockType` в функцию `init` вашего плагина, например: 

function my_plugin_init() {
	wp.blocks.registerBlockType('my-plugin/my-block', {
		title: 'Мой блок',
		icon: 'smiley',
		category: 'common',
		edit: function() {
			return wp.element.createElement(
				'p',
				null,
				'Это мой собственный блок!'
			);
		},
		save: function() {
			return wp.element.createElement(
				'p',
				null,
				'Сохраненный контент моего блока'
			);
		},
	});
}

wp.plugins.registerPlugin('my-plugin', {
	render: my_plugin_init,
});
wp.plugins.initializePlugin('my-plugin');
3. Убедитесь, что ваш плагин подключен и правильно загружается. Вы можете использовать функцию `wp_enqueue_script` для подключения файла JavaScript вашего плагина, например: 

function my_plugin_enqueue_script() {
	wp_enqueue_script('my-plugin', plugin_dir_url(__FILE__) . 'js/my-plugin.js', array('wp-blocks', 'wp-element'));
}

add_action('enqueue_block_editor_assets', 'my_plugin_enqueue_script');
В этом примере мы предполагаем, что ваш файл JavaScript находится в папке "js" внутри вашего плагина. 4. После внесения изменений сохраните свой плагин и перезагрузите страницу редактора блоков WordPress. Ваш собственный блок должен появиться в разделе "Общее" в библиотеке блоков. Если после выполнения всех этих шагов ваш блок все еще не появляется, убедитесь, что вы не получаете каких-либо ошибок JavaScript в консоли браузера. В этом случае, пожалуйста, сообщите о них, чтобы мы могли помочь вам решить проблему. Надеюсь, это поможет вам добавить свой собственный блок в редактор блоков WordPress! Если у вас возникнут дополнительные вопросы, не стесняйтесь задавать. Удачи!

Добавить ответ