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 the current post in the loop is greater than the current time i.e., future/upcoming.

Ex.: You have an event custom post type with event_date custom field and a Query Loop to display the recently published 10 events. At a given time, let’s say 2 of these events occur in the future. We want a CTA button to appear only for these 2 events and not the other 8.

Sample query loop structure:

In this example, we have used Meta Box to register a “Date Picker” field with “Save value as timestamp” ticked.

Add this in child theme’s functions.php or a code snippets plugin:

// Output the specified element in the query loop if a date-type custom field is in the future.
add_filter( 'bricks/element/render', function( $render, $element ) {
	if ( $element->id === 'ykargg' ) {
		// get the post ID in the loop
		$post_id = BricksQuery::get_loop_object_id();

		// get the event date timestamp value
		$event_date = get_post_meta( $post_id, 'event_date', true );

		// return true if the event date value is greater than the current time
		return $event_date > time();
	}

	return $render;
}, 10, 2 );

Replace ykargg with the Bricks ID of the element (the button in this case).