14th Jul '22
/
2 comments

Show Product Categories Count Using Bricks Filter Hook

Show Product Categories Count Using Bricks Filter Hook

Unable to find terms count from the Dynamic Data provided by Bricks theme? It’s okay, this simple tutorial shows you how to properly get the terms count by using bricks/element/settings filter hook. (Bricks v1.4.0.1 and above).

Step1: Prepare A Terms Query Loop

My plan is create a Terms query loop to show some product category blocks in home page. With the help from Bricks query loop features, I can do it very fast. Of course you can style it as you like.

I set product categories (terms) query loop in one of my div.

Step 2: Use Basic Text For Term Name

In the loop, you are free to add any desired elements. I choose Basic Text to output the term name. Remember the ID because we will use that in our filter hook.

Just drag a Basic Text element to output the term name

Result as expected.

Now the basic text will dynamically display the product categories name as expected.

Step 3: bricks/element/settings Filter Hook

To append the term count after the term name, we can use the very useful filter hook – bricks/element/settings. It was available since Bricks v1.4.0.1 but not documented until v1.5 beta released.

Bricks will first check whether the element should render or not. And if yes, Bricks allows you to change the element’s settings before executing the render logic (Conditional rendering tutorial).

Official bricks/element/settings documentation.

Alright, add the code below in child theme’s functions.php or in a code snippets plugin for a test.

add_filter( 'bricks/element/settings', 'add_product_category_count', 10, 2 );
function add_product_category_count( $settings, $element ){
	
	// Please use your actual Basic-text element's ID
	if ( $element->id !== 'ovajjb' ) return $settings;
	
	// Change the settings as you like here
	
	$settings['text'] = 'Hello';
	
	return $settings;
}

Check in front end. Yes! It works!

All Basic-text element’s with the specific Id changed to “Hello”

Step 4: Append Term Count After Term Name

Next, if we need to show the Term’s count, there are many ways too. You might think of using WP_Query, or get_terms() etc. Yes you can do that, but those are wasting resources because we can use some powerful Bricks helper function to achieve this since it’s already in a query loop!

Some useful functions are here:

  • \Bricks\Query::is_looping() can help us check whether the element is currently inside query loop.
  • \Bricks\Query::get_loop_object_type() will return what the looping object type is, it could be post, term, user etc.
  • \Bricks\Query::get_loop_object_id() will return the current looping object Id.
  • \Bricks\Query::get_loop_object() will return the current looping object itself. Super nice huh?

Now let us amend the previous test code as below.


/** SET Product category count */
add_filter( 'bricks/element/settings', 'add_product_category_count', 10, 2 );
function add_product_category_count( $settings, $element ){

	// Please use your actual Basic-text element's Id
	if ( $element->id !== 'ovajjb' ) return $settings;

	if ( \Bricks\Query::is_looping() && \Bricks\Query::get_loop_object_type() === 'term' ) {

		// Easily get the term here
		$current_term = \Bricks\Query::get_loop_object();

		// Append the term count if count is valid
		if ( $current_term->count ) {
		  $settings['text'] .= " ({$current_term->count})";
		}

	}

	return $settings;
}

Perfect!!

Get access to all 630 Bricks code tutorials with BricksLabs Pro

2 comments

  • Hi Jenn, thanks for sharing this piece of code, much appreciate. I am trying without success to implement a condition to show "0" if the term count = 0. Any hints on how to manage this situation?

    cheers

    • A

      Hi Dome. Can you provide more info? Is this on the static Page or an archive page? If the latter, what sort of archive is it? Are you using a query loop? If so, what is the query type?

Leave a Reply to Dome (Cancel Reply)

 

Related Tutorials..

How to create filters with IsotopeJS in Bricks (Part 1)

How to create filters with IsotopeJS in Bricks (Part 1)

This tutorial series will explore the IsotopeJS library's features inside the Bricks ecosystem.
Categories:
Pro
ACF Relationship Select Filter in Bricks

ACF Relationship Select Filter in Bricks

In the BricksLabs Facebook group, a user asks: I'm learning about ACF relationships and attempting to output a list of posts on any given page,…
Categories:
Pro
Prefiltering Bricks Terms Query Loop

Prefiltering Bricks Terms Query Loop

Let's say there's a Events CPT with a 'Event Year' custom taxonomy. Sample event year names could be: 2021, 2022, 2024, 2025, 2028 etc. We…
Pro
How to add a Class to all Images in Bricks Galleries

How to add a Class to all Images in Bricks Galleries

Learn how to add a custom class to all the images rendered by Bricks' Gallery elements so these images can be excluded from Perfmatters' Lazy…