如何在前端的Wordpress插件中设置自定义块的宽度

Question

我正在尝试在 WordPress 插件中设置自定义块的宽度。当我使用开发者工具查看前端的 CSS 时，我看到了这个

element {
}
:where(body .is-layout-constrained) > :last-child:last-child {
  margin-block-end: 0;
}
:where(body .is-layout-constrained) > :first-child:first-child {
  margin-block-start: 0;
}
body .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: var(--wp--style--global--content-size);
  margin-left: auto !important;
  margin-right: auto !important;
}
.wp-block-create-block-my-custom-block {
  ...
  max-width: 100%;
  ...
}
...

如您所见，

is-layout-constrained

课程优先于我的

wp-block-create-block-my-custom-block

。

我希望该块能够扩展并填充页面的宽度。

我已经看到了一些涉及

theme.json

的信息，但据我所知，这些解决方案仅适用于主题，不适用于插件。

我可以在我的

--wp--style--global--content-size

类中设置

wp-block-create-block-my-custom-block

变量，但这感觉不像“正确”的解决方案。

在 WordPress 插件中设置

max-width

的正确方法是什么？

Answer 1

在 block.json 中，您可以在“supports”下设置“align”属性：

{
  ...
  "supports": {
    "align": ["full", "wide"]
  }
  ...
}

这将在块工具栏上添加一个按钮，允许您设置块的宽度。