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
| Sections | Topics |
| A | Smaller Pages, Faster Loading |
| B | Globally Consistent Product Cards |
| C | Independent, Focused Widgets |
| D | New v2 Widgets |
| E | Building vs. Migrating |
| F | FAQs |
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.