首页 / 中文教程 / 教程

Bricks 区块草稿状态控制:一键把区块设为「草稿」不渲染

Laurent Drapeau 在 Bricks Facebook 群组https://www.facebook.com/groups/brickscommunity/posts/1068186667179186/里分享…

Ray Chan·2026-08-12·约 2 分钟

更新(2025 年 6 月 26 日):该功能自 Bricks 2.0(beta) 起已内置到 Bricks 核心,无需再用下面的代码。见作者推文。若你仍在用 2.0 之前的版本,或想在自己插件里复刻这套控制,下面的代码依然有参考价值。

Laurent Drapeau 在 Bricks Facebook 群组里分享了一段代码,用来在 Bricks 编辑器中快速把某个区块(Section)标记为「Draft(草稿)」,这样它就不会在前端输出。

同样的效果也可以用 Bricks 的条件逻辑(Conditions)功能实现,但这个方法的操作更顺手——直接在元素设置里勾个复选框就行。

下面是作者稍微改进过的版本,避免了 PHP 8 里「Undefined array key」这类警告。

代码放在子主题的 functions.php,或任意代码片段插件(code snippets plugin)里。

代码(仅区块元素生效)

// Add Section Status Control & Settings + Render
add_filter( 'bricks/elements/section/control_groups', function( $control_groups ) {
	$control_groups['draft_controls'] = [
		'tab' => 'content', // or 'style'
		'title' => esc_html__( 'Section Status', 'my_plugin' ),
	];

	return $control_groups;
} );

add_filter( 'bricks/elements/section/controls', function( $controls ) {
	$controls['draft_controls_active'] = [
		'tab' => 'content',
		'group' => 'draft_controls',
		'label' => esc_html__( 'Draft section', 'my_plugin' ),
		'type' => 'checkbox',
	];

	return $controls;
} );

add_filter( 'bricks/element/render', function( $render, $element ) {
	if ( $element->name === 'section' && isset( $element->settings["draft_controls_active"] ) && $element->settings["draft_controls_active"] == true ) {
		$render = false;
	}

	return $render;
}, 10, 2 );

这段代码做了三件事:

  1. 注册控制组:通过 bricks/elements/section/control_groups 过滤器,在区块元素的「内容」标签页下新增一个名为「Section Status」的控制组。
  2. 注册复选框:通过 bricks/elements/section/controls 过滤器,在该组里加一个 draft_controls_active 复选框,勾选即表示「此区块是草稿」。
  3. 拦截渲染:通过 bricks/element/render 过滤器,当区块元素设置了 draft_controls_active 且值为 true 时,把 $render 置为 false,区块就不输出了。

效果:编辑器里每个区块的「内容」标签页都会多出一个「Draft section」复选框,勾上后前端立即不显示该区块。

进阶:给所有元素加草稿控制

上面的代码只作用于区块(section)。想给所有元素都加上草稿开关,用下面这版——它在 init 钩子里遍历 \Bricks\Elements::$elements,为每个元素动态注册相同的控制组和控制:

// Add Draft status control groups and control to all the elements.
add_action( 'init', function() {
	$elements = \Bricks\Elements::$elements;

	$names = array_keys( $elements );

	foreach( $names as $name ) {
		add_filter( "bricks/elements/{$name}/control_groups", 'bl_add_control_groups' );

		add_filter( "bricks/elements/{$name}/controls", 'bl_add_controls' );
	}
}, 30 );

function bl_add_control_groups( $control_groups ) {
	$control_groups['draft_controls'] = [
		'tab' => 'content',
		'title' => esc_html__( 'Set Draft Status', 'my_plugin' ),
	];

	return $control_groups;
}

function bl_add_controls( $controls ) {
	$controls['draft_controls_active'] = [
		'tab' => 'content',
		'group' => 'draft_controls',
		'label' => esc_html__( 'Draft status', 'my_plugin' ),
		'type' => 'checkbox',
	];

	return $controls;
}

add_filter( 'bricks/element/render', function( $render, $element ) {
	if ( isset( $element->settings["draft_controls_active"] ) && $element->settings["draft_controls_active"] == true ) {
		$render = false;
	}

	return $render;
}, 10, 2 );

注意这版和第一版的差别:bricks/element/render 回调里不再判断 $element->name === 'section',所以对所有元素生效;而控制注册部分改成了 init 钩子里循环注册,配合两个具名函数 bl_add_control_groups / bl_add_controls,避免匿名回调重复注册。

参考

需要帮忙?

用 Bricks 建站?我接客户项目。

从快速营销站到完整的 Bricks 建站,再到从 Elementor 迁移——我都做过。本站每篇教程都来自真实项目经验。告诉我你的需求,一个工作日内回复。

  • Bricks 建站与改版
  • Elementor / Divi → Bricks 迁移
  • Bricks → Astro / headless 性能升级
  • 速度优化,PageSpeed 95+ 目标