WooCommerce Product Gallery Images in Bricks Query Loop

Updated on 22 July 2024

Looking to output the images attached to Product gallery on a single WooCommerce product page in a Bricks query loop?

While it is possible to use the built-in "Product gallery" element or feed in the product gallery images to an "Image Gallery" element via this tutorial, you might want to use a query loop sometimes for more control.

This Pro tutorial shows how this can be achieved using a Media post type query. We shall also ensure that the Section gets output only if there is at least 1 product gallery image for any given product.

Step 1

Edit the template that applies to single Products with Bricks.

Add a Section and inside its Container, an optional "Product Gallery" Heading element and below that a Block element inside a Container.

Add an Image inside the Block.

Enable query loop on the Block.

Click the query icon and enable PHP query editor.

Paste: