5th Nov '23
/
0 comments

Quick View Buttons for Woo Products in Bricks

This Pro tutorial provides the steps to set up quickview buttons for products in a Woo (formerly, WooCommerce) products grid using Bricks' Popups and Interactions features.

Clicking a button opens a popup (lightbox) that shows that product's image/gallery on the left and product title, price, short description, Add to cart button and product meta on the right.

The benefit of this method over a plugin for showing product quickview is that we have full control w.r.t what's shown inside the popup.

Step 1

Go to Bricks → Templates and import "Product Info" Popup template from the link below.

This is a BricksLabs Pro tutorial.

For full access login below or create your BricksLabs Pro account

Get access to all 610 Bricks code tutorials with BricksLabs Pro

Related Tutorials..

Pro
Related FAQs on Product pages Based on Product Category Taxonomy in Bricks

Related FAQs on Product pages Based on Product Category Taxonomy in Bricks

On product pages, we show all the FAQs associated with the current WooCommerce product's product categories.
Categories:
Pro
Stock Quantity Block for WP Grid Builder

Stock Quantity Block for WP Grid Builder

In the unofficial WP Grid Builder Facebook group a user asked: Is it possible to show stock quantity on the card? I can't find it…
Categories:
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.
Categories:
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…
How To Remove the Featured Image from WooCommerce Product Gallery

How To Remove the Featured Image from WooCommerce Product Gallery

Product Gallery on single product pages in WordPress include the product's featured image by default. If you are looking to exclude it so only the…
Categories: