将包含DIV的内容添加到核心Gutenberg块

时间:2019-02-22 作者:Bagseye

我正在处理的设计要求每个古腾堡街区都有彩色背景(本例中为白色)max-width: 1160px 以及其中的内容max-width: 800px 和居中。类似下图:

enter image description here

需要这样的设置:

<main class="site-background">
    <div class="width-1160">
        <p class="width-800">Some text content...</p>
    </div>
</main>
目前,我们只使用核心古腾堡块,但它生成的标记与下面的类似,没有包含<div>:

<main class="site-background">
    <p class="width-800">Some text content...</p>
</main>
有没有办法添加包含<div> 所有古腾堡内容块的核心更新是否安全?

1 个回复
最合适的回答,由SO网友:birgire 整理而成

我确信还有其他方法,例如仅使用CSS或Add custom class to core blocks in Gutenberg, 但关于:

将包含DIV添加到核心古腾堡块

一种可能是render_block 过滤器:

add_filter( \'render_block\', function( $block_content, $block ) {
    // Target core/* and core-embed/* blocks.
    if ( preg_match( \'~^core/|core-embed/~\', $block[\'blockName\'] ) ) {
       $block_content = sprintf( \'<div class="some__class">%s</div>\', $block_content );
    }
    return $block_content;
}, PHP_INT_MAX - 1, 2 );
在前端分割包裹核心块。

更改HTML布局可能会影响网站的当前样式。

相关推荐

Admin Theme customization

我遵循wordpress codex网站上关于通过插件创建管理主题的说明。我激活了插件,但我的样式表没有包含在<head>.. 这是我的代码:add_action( \'admin_init\', \'kd_plugin_admin_init\' ); add_action( \'admin_menu\', \'kd_plugin_admin_menu\' ); function kd_plugin_admin_init() { /* Register