WordPress中的块通常捆绑在插件中,并使用块.json
元数据。
虽然可以只在客户端注册块,但最佳实践强烈建议在服务器和客户端注册块。这种双重注册对于启用动态渲染、块支持、块挂钩和样式变化等服务器端功能至关重要。如果没有服务器端注册,这些功能将无法正常运行。
例如,如果你想要一个块通过以下方式设计主题.json
,必须在服务器上注册。否则,块将无法识别或应用在中指定给它的任何样式主题.json
.
下图详细说明了块的注册过程。
服务器上的块注册通常在主插件PHP文件中进行寄存器块类型()
函数调用初始化
挂钩。此函数通过读取存储在块.json
文件。
此函数用于注册块类型,在这种情况下主要使用两个参数,尽管它可以适应更多变化:
在开发过程中块.json
文件通常从型钢混凝土
(源)目录到建造
目录作为编译代码的一部分。因此,在注册块时,请确保$块类型
路径指向块.json
中的文件建造
目录。
这个寄存器块类型()
函数返回注册的块类型(工作包块类型
)成功或假
失败时。下面是一个使用渲染器回调
.
寄存器块类型(__方向__.'/构建',阵列(“render_callback”=>“render_block_core_notice”,));
下面是一个更完整的示例,包括初始化
挂钩。
函数minimal_block_ca6eda__register_block(){寄存器块类型(__DIR__.'/build');}add_action('init','minimal_block_ca6eda__register_block');
请参阅完整块示例的以上代码
当块已经在服务器上注册时,只需使用寄存器块类型
方法@wordpress/块
包裹。您只需要确保使用与块的块.json
文件。下面是一个示例:
从“@wordpress/blocks”导入{registerBlockType};registerBlockType('my-plugin/notice'{编辑:编辑,// ...其他客户端设置} );
虽然通常建议使用PHP在服务器上注册块,以获得“使用元数据文件的好处”部分中,您可以选择只在客户端注册块。这个寄存器块类型
方法允许您使用元数据注册块类型。
该函数接受两个参数:
块名称或元数据
(一串
|对象
):这可以是作为字符串的块类型名称,也可以是包含块元数据的对象,通常从块.json
文件。
设置
(对象
):这是一个包含块的客户端设置的对象。
您可以导入块.json
文件(或任何其他.json文件
如果您使用的是构建过程,例如wp-脚本
.
这个设置
作为第二个参数传递的对象包含许多属性,但这是两个最重要的属性:
编辑
:在我们的块的编辑器中使用的React组件。
节约
:返回保存到数据库的静态HTML标记的函数。
这个寄存器块类型()
函数返回注册的块类型(WP块
)成功或未定义
失败时。下面是一个示例:
从“@wordpress/blocks”导入{registerBlockType};从“@wordpress/block-editor”导入{useBlockProps};从“”导入元数据/块.json';const Edit=()=><p{…useBlockProps()}>Hello World-块编辑器;const save=()=><p{…useBlockProps.save()}>你好世界-前端;registerBlockType(元数据名称{编辑:编辑,保存,} );
请参阅完整块示例的以上代码