11th Jun '24
/
3 comments

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

Get access to all 630 Bricks code tutorials with BricksLabs Pro

3 comments

  • This was so easy and so amazing. Bravo David!

    Can the same logic apply to turn on and off a transparent header using ACF true/false in a per-page basis?

  • Nice, easy and really helpful. Thank you!

  • Michael van Dinther

    Easy!

Leave your comment

 

Related Tutorials..

Pro
Condition for checking Bricks content

Condition for checking Bricks content

Only outputting Bricks content when a Page is built with Bricks, otherwise display WP content.
Categories:
Pro
Top Bar Above Sticky Header in Bricks

Top Bar Above Sticky Header in Bricks

How to set up a top bar above sticky header in Bricks Builder so only the header remains sticky when scrolling.
Categories:
Tags:
Conditional Output based on Manual Excerpt in Bricks

Conditional Output based on Manual Excerpt in Bricks

How to display a post’s excerpt only if it has been manually set.
Categories:
Is WooCommerce Cart Empty Condition in Bricks

Is WooCommerce Cart Empty Condition in Bricks

Updated on 5 Nov 2024 Looking to conditionally render an element depending on whether the user's cart is empty or not when using WooCommerce? Add…
Weekday Condition in Bricks

Weekday Condition in Bricks

As of Bricks 1.7, the built-in "Weekday" condition does not work correctly. This is most likely due to it not taking the site's timezone (set…
Categories:
Conditional Output on the First Page of Archives in Bricks

Conditional Output on the First Page of Archives in Bricks

How to output an element on an archive page only if we're on the first page of the archive.
Categories:
Pro
Conditionally outputting an element in a Query Loop based on date-type custom field

Conditionally outputting an element in a Query Loop based on date-type custom field

This Pro tutorial shows how to output an element in a Bricks' query loop only if the value of a date-type of custom field for…
Categories:
Pro
Conditional Section when Post has a Featured Image in Bricks

Conditional Section when Post has a Featured Image in Bricks

This Pro tutorial provides the steps to output a Section in Bricks on single posts (of any post type) only if the post has a…
Categories: