在Wordpress块主题中添加自定义块(不使用插件)

Question

基本上我想开发一个wordpress块主题。为了便于自定义，我想在我的主题中添加一些自定义块。但我不想为此创建一个插件。自定义块将在我的主题内。当有人安装我的主题，他会得到那些自定义块内置与我的主题。我如何才能实现它，我如何组织我的文件夹结构，以及?

Answer 1

我只需要做同样的事情:在我的主题中注册一个自定义块。

创建src/blocks内部的块

首先，我使用npx @wordpress/create-block my-block在src/blocks中创建了块。该块现在位于{theme}/src/blocks/my-block中。

构建块

然后，我使用npm run build构建块。

从构建文件夹注册block.json

最后，我使用构建的block.json元数据文件注册了块:

显然也

function register_my_block()
{
register_block_type( dirname(__FILE__) . '/src/blocks/my-block/build/block.json' );
}
add_action('init', 'register_my_block');

Answer 2

您所需要做的就是创建一个src文件夹内的主题，然后把你的块文件夹(如下所示的结构)。

文件夹结构可以是:

——theme文件夹——比;src——比;block文件夹在块文件(edit.js, index.js, save.js等)

对于块文件:

现在是时候安装wp-scripts包来使用wp块了。为此，更新package.json文件添加以下行。然后在终端进入主题文件夹并命令'npm install它会安装你所有的依赖包，然后输入'npm start"命令。

{
"main": "build/index.js",
"scripts": {
"build": "wp-scripts build",
"format": "wp-scripts format",
"lint:css": "wp-scripts lint-style",
"lint:js": "wp-scripts lint-js",
"packages-update": "wp-scripts packages-update",
"plugin-zip": "wp-scripts plugin-zip",
"start": "wp-scripts start"
},
"devDependencies": {
"@wordpress/scripts": "^23.4.0"
}
}

注意:你需要通过register_block_type函数注册块为PHP的方式或registerBlockType为JS的方式。否则，上面的代码将无法工作。以上代码只会创建您的文件。