27th Oct '22
/
9 comments

Top-Level Product Categories in Bricks

Updated on 18 Mar 2024.

This Pro tutorial provides the steps to show top-level WooCommerce product categories in Bricks using a query loop.

top-level-product-categories-bricks

We shall output the product category image and name linked to the product category archive in a grid.

Step 1

Let us first define a custom function that returns the product category image.

Add this in your 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

Tagged:
Bricks
Pro
WooCommerce

Sridhar Katakam

Sridhar Katakam is a Bricks enthusiast. He likes helping others by researching and solving WordPress-related problems and building websites.

Get access to all 633 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.
Read more →
Categories: Bricks, Pro
Tags: WooCommerce
Pro
How to Add Support for Variable Products in Bricks WooCommerce Filters

How to Add Support for Variable Products in Bricks WooCommerce Filters

Filtering for In Stock or Out of Stock WooCommerce products using Bricks' filters currently only works at the product level and not variation level. This…
Read more →
Categories: Bricks, Plugins, Pro
Tags: WooCommerce
Condition based on WooCommerce Product Attributes in Bricks

Condition based on WooCommerce Product Attributes in Bricks

How to display elements only when a specific WooCommerce product attribute is selected.
Read more →
Categories: Bricks, Free, Plugins
Tags: WooCommerce
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.
Read more →
Categories: Bricks, Pro
Tags: JavaScript, sessionStorage
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.
Read more →
Categories: Bricks, Pro
Tags: Accordion, WooCommerce
Pro
On Sale Ribbon for WooCommerce Products Query Loop in Bricks

On Sale Ribbon for WooCommerce Products Query Loop in Bricks

Showing a SALE ribbon for products that are output using Bricks‘ Query Loop.
Read more →
Categories: Bricks, Plugins, Pro
Tags: WooCommerce