Skip to content

WooCommerce Product Quick View

ShopPress offers a variety of features to let users customize the builders and sections of Woocommerce shop pages. In this article, we will guide you through the process of creating a Quick View functionality for products, which can enhance the user experience and improve product accessibility.

Enabling WooCommerce Product Quick View

Please head over to ShopPress, enter the Components menu, toggle on Quick View and click on the “Config” button in the Quick View section, as illustrated in the screenshot below.

WooCommerce Product Quick View

Here, you have two options. You can either use the ShopPress static template of Quick View or create your own Quick View page from scratch.

Static Quick View Page Design

When the Static design option is selected, ShopPress will override the default design of the quick view pop-up with a pre-designed template.

Quick View

You can choose the location of Quick View on the archive page from the dropdown options provided, and the result will be like the image below.

Quick View Page Design

To create a custom template, select the “page builder” option. This will allow you to add a new template and modify it according to your preferences using the available widgets.

Page Builder Quick View Design

Creating a custom Quick View page is made easy with Page Builder. Click “Add New,” enter a template name, and create the template. Then, select the edit icon to navigate to the Elementor page.

Page Builder Quick View Design

Now, on this Elementor page, you can use the “Single Product” widgets to create the Quick View popup on the products page by dragging your preferred widgets to the Elementor main area.

As you can see in the screenshot below, we have created a Quick View card using Product Thumbnail, Title, Price, Description, and other widgets.

Page Builder Quick View Design

You can edit and customize each widget individually to your preferred design.

Assign Quick View Button to the Shop/Archive page

To utilize the quick view feature on the Sale Products page, go to ShopPress > Components > Product Loop and select the “config” button. Then, proceed to edit the Sale Products page (any page can be used in this section).

Assign Quick View Button to the Shop/Archive page

Edit Quick View Page

Now it’s time to add the Quick View widget and then design its style with Elementor.

Finally, when a user clicks on the Quick View on the shop, the created popup will appear.

Share this article:

ShopPress Plugin Helpdesk

Need Assistance? We can help!

Our responsive customer support team boasts a high customer satisfaction rating. Should you have any issues with the plugin, do not hesitate to contact us and remember we are always here to help.