Skip to content

How to Add Product & Post Quick View in Elementor?

Table Of Content

Clicking through to a full product or post page just to check one detail interrupts browsing – a quick preview popup keeps shoppers on the listing.

The Quick View widget adds a popover preview trigger to products (or any post type), confirmed to work against WooCommerce products and ordinary posts alike.

For the full settings tour of every Woo Builder widget, see Woo Builder Settings Overview.

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

Before You Start

  • Prerequisite: Elementor (free) installed and active.
  • Prerequisite: WooCommerce installed and active, with at least one published product.
  • Edition: all Woo Builder widgets are part of The Plus Addons for Elementor Pro – a Pro licence is required.
  • Widget to enable: go to The Plus Addons > Widgets, search for Quick View and turn its toggle on.
  • A published product to preview – for example “Wool Beanie” on this site.

Steps

  1. Add the Quick View widget to your product/post listing template.
  2. From Post Type, choose which post type it previews – this list is built live from every post type registered on the site (Post, Page, Product, and any custom post types), not hardcoded to Product.
  3. From Quickview, leave it at Default to use the widget’s built-in preview layout.
Post type dropdown with all registered post types
Quickview dropdown set to default

Front End Result

Clicking the quick-view trigger opens a popover showing the chosen post/product’s title, image, price (for products) and a short description, without navigating away from the listing page.

Quick view popover open over a product listing

Settings Overview

SettingWhat it doesDefault
Post TypeWhich post type this Quick View instance previews.Post
QuickviewDefault built-in layout or Custom Template.Default

Related Docs

Related Frequently Asked Questions

Related Docs