17th Mar '23
/
2 comments

Products in the Same Product Categories as the Current Product in Bricks

Products in the Same Product Categories as the Current Product in Bricks

Updated on 15 Apr 2024

This Pro tutorial provides the steps to output WooCommerce products related by the current product's categories when viewing single product pages in Bricks.

We are going to ensure that

  • the Section gets rendered only if there is at least 1 related product.
  • "Related Product" heading or "Related Products" heading is output depending on the number of related products.

Bricks builder comes with a Related Products element. This tutorial is meant for the case when you want to instead build the layout of the related product visually using a Query Loop for more control of what info should appear for each product and in what order.

Step 1

Edit your single WooCommerce product template with Bricks.

Step 2

Copy the following JSON of the fully-built DIV from our test site and paste it in your template.

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Get access to all 633 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
Making a Nav Menu Item Active for Custom Post Type Single Views in WordPress

Making a Nav Menu Item Active for Custom Post Type Single Views in WordPress

Consider this scenario: CPT: project Page titled "Project" is being used to show a list/grid of all the projects rather than the CPT archive. When…
Categories:
Pro
Limit the Number of Posts in a Bricks Query Loop of Relationship Type

Limit the Number of Posts in a Bricks Query Loop of Relationship Type

Updated on 12 Dec 2023 Bricks Query Loop popup does not have a control for setting the number of posts to be output when the…
Removing Action/Filter Inside a Plugin’s Namespaced Class Constructor

Removing Action/Filter Inside a Plugin’s Namespaced Class Constructor

Recently worked with a friend figuring out how to remove/undo/cancel an add_action() line that's inside a plugin's constructor inside a PHP Class with the file…
Categories:
Tags:
How to add a “Sold Out” badge for out of stock products in Bricks

How to add a “Sold Out” badge for out of stock products in Bricks

Looking to add a "Sold Out" badge for products in the Shop page for WooCommerce products that are out of stock when using Bricks' Products…