我正在尝试为古腾堡创建一个自定义块。所以我尝试了一些简单的方法:
JS文件:
var el = wp.element.createElement;
wp.blocks.registerBlockType(\'test/blocks\', {
title: \'Test Blocks\',
icon: \'smiley\',
category: \'common\',
attributes: {
content: {type: \'string\'}
}
},
edit: function(props) {
return
el( \'div\', {},
el( \'p\', {}, window.wp.i18n.__( \'Hello World!!!\' ) )
);
},
save: function(props) {
return
el( \'div\', {},
el( \'p\', {}, window.wp.i18n.__( \'Hello World!!!\' ) )
);
})
js文件是我制作的插件的一部分,它由加载。php文件。问题是它甚至没有在古腾堡编辑器中显示为块选项。所以我的问题是:
我当前的代码有什么问题如何添加一些字段?文本编辑、按钮等有可能像中继器一样有多个字段吗为什么每个人都会为此制作插件?为什么不直接从函数中加载js文件呢。php
最合适的回答,由SO网友:moped 整理而成
至1。您过早地关闭了registerBlockType,为了避免进一步的反应错误,您应该在以下行中打印您的返回return
在编辑/保存功能中
var el = wp.element.createElement;
wp.blocks.registerBlockType(\'test/blocks\', {
title: \'Test Blocks\',
icon: \'smiley\',
category: \'common\',
attributes: {
content: {type: \'string\'}
},
edit: function(props) {
return el( \'div\', {},
el( \'p\', {}, window.wp.i18n.__( \'Hello World!!!\' ) )
)
},
save: function(props) {
return el( \'div\', {},
el( \'p\', {}, window.wp.i18n.__( \'Hello World!!!\' ) )
);
}
});
至2。你可以在古腾堡手册中找到一些元素
here. 请注意顶部的搜索字段
至3。您想在哪里为什么设置多个字段
至4。如果该块是一个插件,则很容易加载和扩展文件。您还可以为您的块注册编辑器和前端css文件,这些文件都在框中;o)