12th Dec '23
/
0 comments

How to Modify Products Element Query in Bricks to Output Child Products

This Pro tutorial provides the steps to limit WooCommerce products output by Bricks' Products element on single product pages to only the children of the current product.

Step 1

Let's make the product post type hierarchical.

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

<?php add_filter( 'woocommerce_register_post_type_product', function ( $args ) { $args['hierarchical'] = true; $args['supports'][] = 'page-attributes'; return $args; } );

Edit your products and set up parent-child arrangements as needed.

Step 2

Edit your single WooCommerce product template with Bricks.

Add a Section and inside its Container, an optional heading and Products element.

Step 3

Let's

  1. define a custom function that returns an array of current post's (of any post type) child posts and the count of the same
  2. hook a function to bricks/query/result filter to limit the products to only the child products on single WooCommerce product pages

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 610 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
Out of Stock Ribbon for WooCommerce Products in Bricks

Out of Stock Ribbon for WooCommerce Products in Bricks

Show an “OUT OF STOCK” ribbon for WooCommerce products that are output via the Products element on listing pages.
Categories: