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

Instant access to 390+ Bricks code tutorials with BricksLabs Pro