Disabling Bricks’ Header & Footer Conditionally with Custom Fields

Unlike element conditions, when it comes to setting conditions for templates in Bricks there isn’t a ‘dynamic data’ option in the dropdown that we can use to get values from custom fields. However, you may wish to give content editors the ability to disable headers or footers on specific posts/pages using custom fields.

Let’s go through how we can do it..

Using Filters

Bricks has two filters, ‘bricks/render_header’ and ‘bricks/render_footer’, which can be used to override the HTML that is output for the header and footer.

We can use these to change the output conditionally based on a custom field.

In this example, we’ll use ACF’s True/False field.

Step 1.

Create two True/False custom fields, ‘disable_header’ and ‘disable_footer’. Apply these to the post types needed.

Step 2.

Use Bricks’ filters to change HTML output conditionally.

Here’s we’re first checking if is_singular(), to make sure we’re only affecting single post/pages, and then checking if the custom field for the current post is true. If true, nothing is rendered.

Add this code to your child theme functions.php file, or code snippet plugin.

/* do not render header if disable_header field is true */
add_filter('bricks/render_header', function( $header_html ) {
	return is_singular() && get_field('disable_header') ? '' :    $header_html;
});

/* do not render footer if disable_footer field is true */
add_filter('bricks/render_footer', function( $footer_html ) {
	return is_singular() && get_field('disable_footer') ? '' : $footer_html;
});

That’s it

Instant access to 390+ Bricks code tutorials with BricksLabs Pro

1 comment

Leave your comment