10th Mar '26
/
0 comments

WooCommerce Products Live Search in Bricks

This Pro tutorial provides the steps to set up a live search for WooCommerce products in Bricks.

Note: Bricks' live search works with any type of query, not just posts.

Step 1

Edit Header template with Bricks.

Add a Section having a query loop-enabled Block with the query type set to Products.

JSON link for copying the fully-built Section can be found below.

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Tagged:
Bricks
Plugins
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
[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
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
How to Modify Products Element Query in Bricks to Output Child Products

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…
Read more →
Categories: Bricks, Plugins, Pro
Tags: bricks/query/result, WooCommerce
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…
Read more →
Categories: Bricks, Free, Plugins
Tags: Dynamic Data, WooCommerce
Pro
On Sale Products Bricks Query Loop

On Sale Products Bricks Query Loop

Looking to show only the WooCommerce products that are on sale in Bricks? Set up a query loop, enable the PHP query editor and paste:
Read more →
Categories: Bricks, Plugins, 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
Pro
Similarly Priced WooCommerce Products Bricks Query Loop

Similarly Priced WooCommerce Products Bricks Query Loop

How to show products priced within a percentage of the current single product's price.
Read more →
Categories: Bricks, Plugins, Pro
Tags: WooCommerce
Pro
How to Redirect WordPress Search to WooCommerce Shop Filter by Product Title or SKU

How to Redirect WordPress Search to WooCommerce Shop Filter by Product Title or SKU

Learn how to redirect users to the Shop page with filtered results if the searched term matches a WC product title or SKU. And, if…
Read more →
Categories: Bricks, Plugins, Pro
Tags: Search, WooCommerce