
WooCommerce Quick View adds a ‘quick view’ button to product loops that show product details in a lightbox when clicked.
Installation
↑ Back to top- Download the .zip file from your WooCommerce account.
- Go to: WordPress Admin > Plugins > Add New and select Upload Plugin, then Choose File and select the file you downloaded.
- Install Now and Activate the extension.
More information at: Install and Activate Plugins/Extensions.
Setup and Configuration
↑ Back to top- Go to: WooCommerce > Settings > General.
- Scroll down to the Quick View section, where you can enable one of two methods for displaying the Quick View pop-up:

- Quick View Button. Insert a Quick View button to be appended to the product loop.
- Any non-ajax add-to-cart button e.g., variation cart buttons
3. Save changes.
Usage
↑ Back to topQuick View buttons
↑ Back to topThe Quick View button will look something like this in the loop:

Quick View modal
↑ Back to topWhen a Quick View modal is triggered, the product will look similar to this:

The modal window shows the following product information:
- Product title
- Product image and variation image (if it is a variable product and a specific variation is selected)
- Product gallery images (if set)
- Price
- Short description
- Add to cart button
- SKU
- Category
- View Full Details button (links to product page)
Customization
↑ Back to topChanging the Quick View button template
↑ Back to topTo customize the button, copy woocommerce-quick-view/templates/loop/quick-view-button.php to your theme: woocommerce-quick-view/loop/quick-view-button.php and edit the file.
Alternatively, the button HTML is filtered through the woocommerce_loop_quick_view_button
filter (modify output with http://codex.wordpress.org/Function_Reference/add_filter).
Changing the Quick View template
↑ Back to topTo customize the product data shown in the modal, copy woocommerce-quick-view/templates/quick-view.php to your theme: woocommerce-quick-view/quick-view.php and edit the file.