3rd Nov '22
/
8 comments

Draft Status Control for Sections in Bricks

Update on 26 Jun 2025: This is now built into Bricks since Bricks 2.0 (beta). See my tweet.


Laurent Drapeau shared code in the Bricks Facebook group for quickly setting a Section in the Bricks editor as a “Draft” so it won’t be output in the frontend.

While the same can also be done using the Conditions feature, this method is a little more convenient.

Here’s a slightly improved version that ensures that there are no “Undefined array key” warnings.

Goes in child theme’s functions.php or a 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 );

Update: To add the control to all elements, use this code instead:

// 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 );

References

https://academy.bricksbuilder.io/article/filter-bricks-elements-element_name-control_groups/

https://academy.bricksbuilder.io/article/filter-bricks-elements-element_name-controls/

https://academy.bricksbuilder.io/article/filter-bricks-element-render/

Step 3 of https://itchycode.com/create-my-custom-conditional-visibility-feature-in-bricks-theme-without-add-on/

Get access to all 610 Bricks code tutorials with BricksLabs Pro

8 comments

  • After the latest WP update to 6.7.2 the snippet produces a fatal error: Error Message: Uncaught Error: Class "Bricks\Elements" not found in SNIPPET:26

  • Philippe Boivin

    Thanks Sridhar for this code, it's now way easier to do test. :-) I've added the admin only code and modified the text so it's more clear to users.

    Screenshot: https://app.screencast.com/zJ3VlOBDv6Fcs

    The code (just to make it easy to use):

    // 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 for Admin', 'my_plugin' ), ];

    return $control_groups; }

    function bl_add_controls( $controls ) { $controls['draft_controls_active'] = [ 'tab' => 'content', 'group' => 'draft_controls', 'label' => esc_html__( 'Draft status (only visible to admin)', '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 && ! current_user_can( 'manage_options' ) ) { $render = false; }

    return $render; }, 10, 2 );

  • Emma Nuel

    This is very useful. Is it possible to make admins see the draft element on the front end?

Leave a Reply to Sridhar Katakam (Cancel Reply)

 

Related Tutorials..

Pro
“Truncate text to these many characters” Bricks Control

“Truncate text to these many characters” Bricks Control

Bricks provides a :<number> dynamic data tag modifier that can be used to limit the amount of text by the specified number of words. Ex.:…