14th Sep '23
/
5 comments

Conditional Bricks Templates Based on Product Category Hierarchy Levels

A user wrote:

My products are categorized in hierarchised product categories (nested categories), as you can see in attachment. With different levels...

I'd like to create differten templates for product archives depending on the level of these hierarchies, for example: Level 1 hierarchy --> Template 1, then Level 2 hierarchy --> Template 2... and so on... not a specific product category, but the level of hierarchy is the criteria.

How would you tackle this? I don't see how I could do this with the template conditions... and I need it to be compatible with the very soon feature WPML compatible (being right now developed by Thomas from Bricks), my products / product categories have many languages - I guess this won't be a problem, but I prefer mentionning it if you see it as problematic...

This Pro tutorial provides the steps to programmatically apply Bricks templates to WooCommerce product category archives based on the hierarchy level.

The first thing we need to do when tackling such requirements is define or put in words, what makes up our conditions. In this case, that would be the following.

Level 1: has no parent, should have at least 1 child.

Level 2: should have a parent, parent should not have parent, should have at least 1 child.

Level 3: should have a parent, parent's parent should not have parent.

I wrote the above after creating and looking at three test product categories like this:

Then we create custom PHP functions named say, bl_level1_product_cat(), bl_level2_product_cat() and bl_level3_product_cat() and use these in a function hooked to bricks/active_templates filter.

Step 1

If you have not already, create a template that applies to all product category archives. Ensure that the template condition is set to Archive → Categories & Tags → All terms (Product categories). This template will be like a fallback and gets used/applied for all the product categories that do not meet the criterion for the three levels we defined earlier.

Next, create different templates for Level 1, Level 2 and Level 3. Do not set any template conditions for these.

When done, it should appear something like this:

Note the IDs of Level 1, 2 and 3 templates. We need these in the next step.

Step 2

Add the following in child theme's functions.php or a code snippets plugin:

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Get access to all 609 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
WooCommerce Product Carousel in Bricks

WooCommerce Product Carousel in Bricks

How to set up a carousel that shows WooCommerce products with the product title, price and Add to Cart button for each.
Categories:
Pro
Related FAQs on Product pages Based on Product Category Taxonomy in Bricks

Related FAQs on Product pages Based on Product Category Taxonomy in Bricks

On product pages, we show all the FAQs associated with the current WooCommerce product's product categories.
Categories:
Pro
Current Post Has Parent – Conditional Single Template

Current Post Has Parent – Conditional Single Template

How to apply one of two Bricks templates to posts depending on whether that post has a parent or not.
Pro
[WooCommerce] Sticky on Scroll Add to Cart section in Bricks

[WooCommerce] Sticky on Scroll Add to Cart section in Bricks

Setting up a sticky section that fades in when scrolling down and fades away when scrolled to the top.
Categories:
Appending WooCommerce Endpoint Names To My account Page Titles in Bricks

Appending WooCommerce Endpoint Names To My account Page Titles in Bricks

Adding the WooCommerce endpoint names, “Orders”, “Downloads” after the WooCommerce ‘My account’ Page’s title text at the various endpoint URLs.
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…
Side-by-side WooCommerce Quantity and Add to Cart in Bricks

Side-by-side WooCommerce Quantity and Add to Cart in Bricks

Looking to position the quantity input field and Add to cart button next to each other instead of one below the other in Bricks? Add…
Categories: