将元框添加到Gutenberg时,它看起来与编辑器中的其他项不同。有一个HR,字体不同。
有没有人知道如何修复这个问题,让它看起来像是网站的一个自然部分,而不是“一些垃圾机器人没有添加”。
示例代码:
function myMetaBox() {
add_meta_box(
\'MyMetaBox\',
"Why the odd font?",
\'myBoxOutputCallback\',
\'post\',
\'side\'
);
}
add_action( \'add_meta_boxes\', \'myMetaBox\' );
function myBoxOutputCallback(){
echo ("Gutenberg is a great addition! NOT!");
}
SO网友:Jacob Peattie
在您的示例中,讨论不是元框。元框不是块编辑器的本机部分,仅支持向后兼容。它们不是将这些设置框添加到块编辑器的正确现代方式。这就是为什么他们有不同的风格。
在块编辑器中,这些部分是"Panels", 适合于"Sidebar", 和是反应组件,就像块编辑器的其余部分一样。
关于创建这些内容的完整指南超出了此网站上单个答案的范围,但基本上您需要:
使用register_meta()
注册面板将使用的字段创建React组件以管理自定义字段。在编辑器中创建自定义侧栏的指南中提供了一些相关文档,该指南将启动here, CSS技巧有一篇有用的文章详细介绍了这一点here.如果要将面板添加到现有的“文档”侧栏,而不是自定义侧栏,则需要使用SlotFill, 明确地PluginDocumentSettingPanel
, 将组件输出为现有侧栏中的面板(SlotFills有点像挂钩,允许您将组件添加到编辑器的各个部分)您可以继续使用元框,但它们在视觉上与本机组件不匹配,而本机组件是向编辑器添加字段的新的正确方法。
同样值得考虑的是,您要添加的字段作为常规块是否会更好地工作。创建这些的文档可用here.