Skip to content
  • There are no suggestions because the search field is empty.

WizShop v2: Widget Overview

WizShop v2 is an upgrade to the underlying architecture of the WizShop widget system; not a new product. It makes pages smaller and faster, keeps product cards visually consistent everywhere they appear, and splits large widgets into focused, independent ones.

This article explains what changed, why it matters, and where to find the new v2 widgets in Elementor.

Platform: WizShop      |      Who is this for: Administrators

To Get There: WordPress Dashboard > Edit with Elementor > Search "v2" in the Widgets Panel


Table of Contents 

 


A. Smaller Pages, Faster Loading

One definition, used everywhere

In v1, every widget that showed a product card carried its own copy of the card rendering logic. The listing page, search results, and the product rail each had their own version. That meant more code loaded per page, and a design change had to be made in several places at once.

v2 introduces a shared rendering layer. The image, title, price, and Add to Cart button of a product card are each defined once, and every widget that displays product cards pulls from that shared definition. Pages ship less HTML, and there's a single place to make design changes.

Products load only when needed

The Product Rail in v1 fetched all of its product data on page load, even when the rail sat far below the fold and a buyer might never scroll to it. In v2, rail products load only when the buyer scrolls close to the rail, which noticeably speeds up initial load on content-heavy pages.

Cart pages served from the edge

v1 rendered personalised saved-cart content directly into the page HTML, which blocked CDN caching for logged-in buyers — every visit needed a full server round-trip. v2 ships a neutral HTML shell that the CDN can cache, then fills in buyer-specific cart data after the page has already loaded in the browser. The page arrives faster, and personal content follows right after.


B. Globally Consistent Product Cards

Configure once, see it everywhere

In v1, changing how a product card looked on the listing page had no effect on the Search Modal or the Product Rail. Each widget kept its own separate styling configuration.

v2 introduces shared card controls: configure a card once, and that configuration applies automatically across the Product Grid, Search Modal, Product Rail, and Similar Products drawer.

Cards are built from independent pieces (atoms)

Each part of a product card is now a self-contained component with its own visibility toggle and style controls:

Atom What it Shows
Image Product photo with configurable ratio and object fit
Title Product name with configurable line clamping
Brand Brand or manufacturer name
Price Unit price with sale price support
Add to Cart Inline ATC button or quantity stepper
Inventory Stock status badge (in stock / low stock / out of stock)
Tags Promotional badges (Sale, New, Bestseller, custom)
Wishlist Heart icon for saving to a wishlist

Turn any atom on or off, drag to reorder it within the card, and style each one independently. Because atoms are shared, every product grid on every page reflects those choices; you no longer need to repeat a styling change on every page it appears on.


C. Independent, Focused Widgets

Why widgets were split up

v1 bundled related functionality into large host widgets — Quick View and View Similar both lived inside the Product Grid, and variant selection was embedded in the card renderer. This worked at first, but became a limitation: styling was tied to the host widget, placement was fixed, and adding new features made already-large widgets heavier.

v2 breaks each modal, drawer, and overlay into its own standalone Elementor widget, placed as a sibling on the page rather than nested inside the grid.

What the sibling pattern means for you
  • Lighter product grids: The grid only outputs the grid; drawer markup isn't duplicated per grid instance
  • Independent styling: The Quick View modal can be styled, repositioned, or replaced without touching the grid at all
  • One instance serves the whole page: A single Quick View widget handles every product card on the page; you don't need one per grid

D. New v2 Widgets

In the Elementor widget panel, search "v2" to filter to all v2 widgets. Each widget has its own documentation page covering its controls, sibling widget connections, and common configuration scenarios.

Product Discovery
Widget What It Does
Search Icon Button that opens the Search Modal; place in the header
Search Modal Full search overlay with recent searches, visual search, and atom-rendered results
Product Grid Atom-based product grid; replaces Product Listing Modern for new builds
Product Rail Horizontal scrolling product row with lazy loading and multiple data sources
Product by SKU ID Curated product grid from a hand-picked list of SKU IDs
Product Details
Widget What It Does
Product Main Image PDP hero image, syncs with thumbnail clicks and variant selection
Product Thumbnails Standalone thumbnail strip; clicking updates the main image
Quick View Standalone product preview modal; one instance handles all cards on the page
Variant Drawer Slide-in drawer for variant selection on the PDP
Variant Drawer Trigger Button that opens the Variant Drawer
Variant Switcher Inline variant selector for always-visible selection (alternative to the drawer)
View Similar Standalone similar products drawer
PDP Add to Cart Dedicated ATC button for the product detail page
Quantity Modal Quantity selection step shown before adding to cart
Custom Tooltip Reusable contextual tooltip that can be anchored to any element
Cart & Checkout
Widget What It Does
Cart Products Updated cart line items using the shared atom line renderer
Save Cart Dropdown Compact saved-cart selector; cache-safe. Page loads from CDN, cart data loads after
Checkout Cart Modern Checkout order summary using the same shared line renderer as Cart Products
Checkout Accordion Step-by-step checkout (contact, shipping, billing) with address atom integration
Checkout Entity Drawer Standalone drawer for selecting a saved address or payment method during checkout
Wishlist
Widget What It Does
Wishlist Create Focused form for creating a new named wishlist
Wishlist Selection Popover for assigning a product to one or more wishlists
Media & Notifications
Widget What It Does
Download Media Trigger Button that opens the Download Media Modal; only renders when the feature is enabled
Download Media Modal Modal for downloading product images and files; feature-gated per storefront
Task Notifications Drawer Centralised progress drawer for background tasks (exports, downloads)

E. Building vs. Migrating

  • Building a new page? Use the v2 versions of these widgets.
  • Migrating an existing page? Existing v1 widgets keep working; nothing is removed or forced. Each v2 widget's own documentation page includes a summary of what improved over its v1 counterpart, so you know exactly what you gain by switching.

FAQs

1. If I change a product card's style on one page, will it update everywhere else it's used?

A. Yes, as long as you're editing the shared atom controls (Image, Title, Price, etc.), the change applies automatically to the Product Grid, Search Modal, Product Rail, and Similar Products drawer. This replaces the v1 behaviour where each widget needed its own separate styling pass.

2. Do I need to add a Quick View or View Similar widget to every product grid on my page?

A. No. In v2, Quick View, View Similar, and other drawers are sibling widgets. Add one instance anywhere on the page and it handles every product card on that page.

3. Will switching to v2 widgets break my existing pages?

A. No. v1 widgets continue to work as-is. You only need to switch to v2 widgets when building new pages or when you specifically want the improvements described in a v2 widget's documentation page.

4. Where do I find the v2 widgets in Elementor?

A. Open the page in Elementor and search "v2" in the Widgets panel search bar to filter the list down to all v2 widgets.


Still need help? Reach out to our support team at help@wizcommerce.com.