Wordpress Gutenberg FSE 烦人的内联 CSS

Question

我正在尝试删除一些由 WordPress 添加到前端的 CSS。在上次更新中，Wordpress 添加了这样的类：

<main id="app" class="wp-container-620d4049355bb wp-block-group">

<div class="wp-container-620d404934f13 entry-content wp-block-post-content">

wp-container-620d4049355bb / wp-container-620d404934f13 用于主块。

问题是它还添加了一些 CSS：

.wp-site-blocks > * + * {
  margin-top: var( --wp--style--block-gap );
}

.wp-site-blocks > * {
  margin-top: 0;
  margin-bottom: 0;
}

.wp-container-620d4049355bb > * {
  margin-top: 0;
  margin-bottom: 0;
}

.wp-container-620d404934f13 > * + * {
  margin-top: var( --wp--style--block-gap );
  margin-bottom: 0;
}

这个 CSS 与我的块有冲突，我在其中添加单个类来设置边距。

有谁可以帮我如何删除该CSS？或者删除该类？有趣的是，wp-container-620d42ff1d800 每次页面刷新都是不同的。

谢谢你！

Answer 1

var( --wp--style--block-gap );默认情况下不启用blockGap 功能。如果您在 theme.json 中启用了 blockGap 或 AppearanceTools，您可以通过将其设置为 null 来再次禁用它：

主题.json：

{
    "version": 2,
    "settings": {
        "spacing": {
            "blockGap": null
        }
    }
}

请参阅 theme.json 参考： https://developer.wordpress.org/block-editor/reference-guides/theme-json-reference/theme-json-living/#spacing

如果要删除wp-container-random生成的对齐方式、边距和弯曲样式，可以禁用布局功能。将其添加到您的主题functions.php或类似内容中：

remove_filter( 'render_block', 'wp_render_layout_support_flag', 10, 2 );

如果您激活了古腾堡：

remove_filter( 'render_block', 'gutenberg_render_layout_support_flag', 10, 2 );

wp_render_layout_support_flag 来源：https://github.com/WordPress/WordPress/blob/master/wp-includes/block-supports/layout.php#L142