How to Add Quick View Button on WooCommerce Products in Elementor?

Key Takeaways

  • The Plus Addons for Elementor includes a Product Listing widget that allows users to add a quick view button to WooCommerce products.
  • The quick view feature enables customers to view product details without navigating to the product page, enhancing the shopping experience.
  • Users can choose between a Default layout or a Custom Template for the quick view popup using the Quickview dropdown in the Extra Options tab.
Table Of Content

Are you looking to add a quick view button on your WooCommerce products?

The quick view feature is a great way to give customers a sneak peek of your products without having to navigate to the product page. This not only saves time but also makes the shopping experience more enjoyable for your customers. 

With the Product Listing widget from The Plus Addons for Elementor, you can easily add a quick view button on your product so visitors can view product details quickly.

To check the complete feature overview documentation of The Plus Addons for Elementor Product Listing widget, click here.

Requirement  – This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.

To do this, make sure you’ve added some products to your WooCommerce store, then follow the steps – 

1. Add the Product Listing widget on the page, then select the appropriate listing type, style and layout.

2. Then go to the Extra Options tab, and turn on the Display TP Quickview toggle.

Then in the Quickview dropdown, you’ll find two options – 

Default – This will show the product details in a default layout.

Custom Template – With this, you can use an Elementor template to create a custom layout.

Note: While creating the template make sure to use WooBuilder widgets to show the contents properly.

Select the option which fits your requirement.

Now you should be able to see a quick view button on your products, depending on the option selected or template created, you’ll see the relevant product details in a popup. 

You can also add a quick view button if you are already using the YITH Quick View plugin from the Display YITH Buttons toggle, then turn on the Quick View toggle.

Also, check How to Add Product Compare Button for WooCommerce Products in Elementor.

About the Author

Photo of Aditya Sharma CMO of The Plus Addons for Elementor
CMO · The Plus Addons for Elementor · 10 years experience

He has spent years in the WordPress ecosystem building, breaking, and optimizing sites until they actually perform. He works at the intersection of speed, growth, and usability, helping creators ship websites that load fast and convert. An active WordPress community contributor sharing through tools, tutorials, and direct collaboration. Tested practice, not theory.

WordPressElementorn8nAIClaudeAutomationServer
Get Instant Answers to all your questions about The Plus Addons for Elementor, trained on 1000+ Docs and Videos

Related Frequently Asked Questions

What should I do if the quick view button is not appearing on my WooCommerce products?

If the quick view button isn't showing, ensure that the Product Listing widget from The Plus Addons for Elementor is installed and activated. Also, check that you've enabled the Display TP Quickview toggle in the Extra Options tab. If these settings are correct and it still doesn't appear, verify that your products are properly added to your WooCommerce store.

What are the best practices for using the quick view button on WooCommerce products?

For optimal use of the quick view button, ensure that your product images and descriptions are clear and concise, as this feature is meant to provide a quick overview. Additionally, consider using the Custom Template option to create a tailored experience that highlights key product details effectively.

How can I check the complete feature overview of the Product Listing widget?

To check the complete feature overview of the Product Listing widget from The Plus Addons for Elementor, you can click here. This documentation provides detailed insights into all available options and settings.

Last reviewed: April 11, 2026