7th Sep '22
/
1 comment

Month-based Background Image in Bricks

If you are looking to have different background images of an element for different quarters in a year, here’s one way of doing it:

Register a custom function that returns your desired quarter-specific image URL by adding this code in child theme‘s functions.php or a code snippets plugin:

// Function to return a specific image based on the current quarter.
function bl_get_month_image_url(): string {
	$month = date( 'F' );
	$month_image_url = '';

	switch ( $month ) {
		case 'January':
		case 'February':
		case 'March':
			$month_image_url = '/wp-content/uploads/2022/04/quarter1.jpg';
			break;
		case 'April':
		case 'May':
		case 'June':
			$month_image_url = '/wp-content/uploads/2022/04/quarter2.jpg';
			break;
		case 'July':
		case 'August':
		case 'September':
			$month_image_url = '/wp-content/uploads/2022/04/quarter3.jpg';
			break;
		case 'October':
		case 'November':
		case 'December':
			$month_image_url = '/wp-content/uploads/2022/04/quarter4.jpg';
			break;
	}

	return $month_image_url;
}

Replace the URLs for the four images.

In the Bricks editor select your element and set this for the image URL (dynamic data):

echo:{bl_get_month_image_url}

Reference

https://stackoverflow.com/a/4163212/778809

Get access to all 633 Bricks code tutorials with BricksLabs Pro

1 comment

  • What is the syntax if I want to add multiple images to the "image gallery" widget?

Leave your comment

 

Related Tutorials..

Pro
Bricks Dynamic Data Tag for Text-type Custom Field Value with Word Limit

Bricks Dynamic Data Tag for Text-type Custom Field Value with Word Limit

How to register a new dynamic tag for setting excerpt word limits and outputting an ellipsis (...) at the end.
Categories:
Pro
Media File Attachment Data in Bricks

Media File Attachment Data in Bricks

With a 'Media' query loop, this tutorial shows how we can retrieve various attachment-specific properties inside of the loop.
Categories:
How to List Your Posts Divided by Categories in Bricks

How to List Your Posts Divided by Categories in Bricks

In this tutorial, we'll learn how to display a list of posts divided by each category. The DOM tree Here is how I structured my…
Categories:
Pro
Host Post’s Term in Bricks Query Loop

Host Post’s Term in Bricks Query Loop

Updated on 4 Mar 2025 In the BricksLabs Facebook group a user asked: Hi everyone, I’m facing a tricky situation that might have a simple…
Categories:
Pro
Month and Day Condition in Bricks

Month and Day Condition in Bricks

This Pro tutorial shows how we can define a custom function that takes in a month in the three-letter format (like Dec) and a day…
Categories:
Checking for Post Type in Bricks

Checking for Post Type in Bricks

A way to output elements conditionally based on the current post type in the loop in Bricks.
Categories:
Pro
Conditionally Rendering an Element Outside the Loop based on Taxonomy Term in Bricks

Conditionally Rendering an Element Outside the Loop based on Taxonomy Term in Bricks

A user asks: Hiding element based on taxonomy I have an element in a footer that I want to hide if a page has a…
Categories: