Product photos
Let shoppers see the texture or label.
Content / widget · Elementor module
Image Zoom Dialog Widget Plugin for Elementor
Show an image that opens a larger view in a dialog when clicked, with an actual-size view for close detail.
Included in All AccessClassic Elementor widgetFrom $29 USD / year
Complementor / Image zoom dialogProduct preview
Text, style and layout controls inside Elementor
01 / Interactive demonstration
Try it
These are the actual published outputs of the widget. Try each one on this page.
02 / Inside WordPress
Image zoom dialog controls in Elementor
Content sets the image or a page image by CSS ID, the size, the caption, closing by clicking outside and the labels. The Style tab covers the image border and radius, the zoom badge, the caption, the page dimming, the dialog colours and the buttons.
03 / Website use cases
Where to use image zoom dialog
Product shots, plans and diagrams often need a closer look, but many lightboxes trap keyboard users, lose focus or load every full-size file up front. Image zoom dialog opens the larger view in the browser’s own modal dialog, loads the full file only when asked and returns focus to the image when closed.
Plans and diagrams
Floor plans, maps and charts at full size.
Portfolios
A larger view of each piece.
04 / Installation and setup
How to add an image zoom dialog in Elementor
Start with Complementor installed and your license connected. Enable this module in the WordPress library, then configure it in Elementor.
Install Complementor, connect your license and enable Image zoom dialog in the Complementor library.
Add the widget and choose an image and its size.
Decide whether a click outside closes the larger view.
Style the image, badge and dialog.
Publish the page and try it.
05 / Content and style controls
Customize image zoom dialog in Elementor
Configure the settings available for this module to suit the page you are building.
Native modal dialog.
Esc, Close or outside click.
Focus returns to the image.
Actual-size view with aria-pressed.
Full file loaded on demand.
Plain link without JavaScript.
06 / Choose the right approach
Image zoom dialog and Elementor alternatives
Compare the existing Elementor workflow with this Complementor module before choosing your setup.
Elementor’s lightbox
Opens images linked to their file in Elementor’s own lightbox; it has no actual-size toggle.
Linking to the file
Leaves the page and loses the visitor’s place.
07 / Requirements and compatibility
Image zoom dialog compatibility with Elementor
- Requires Elementor; works without Elementor Pro and WooCommerce.
- One image per widget; it is not a gallery or slider.
- Runs in the visitor’s browser; nothing is sent to the server.
Complementor uses classic Elementor APIs. Atomic-native controls are not implemented. Check your theme, cache and integrations on a staging site before release.
08 / Common setup problems
Troubleshoot image zoom dialog
Check these settings if the published page behaves differently from the editor.
Why is nothing shown?
No image is chosen, or it is attached to a draft or private post.
Why is the page-image button missing?
No image was found at the CSS ID. The editor shows a note.
Why does a click outside not close it?
Close when clicking outside the image is off. Esc and Close still work.
Why does Elementor’s lightbox open too?
Turn off Elementor’s image lightbox for this page, or do not link the image elsewhere.
Image zoom dialog plugin questions
Does it need Elementor Pro?
No. It works with the free version of Elementor.
Is it accessible?
Yes. It is a real link or button, the dialog is named after the alt text and focus returns when it closes.
Does it load the full image straight away?
No. The full-size file loads when the dialog first opens.
Can it zoom an image from another widget?
Yes. Give that image a CSS ID and choose An image elsewhere on the page.
What happens without JavaScript?
The image links to the full-size file.
10 / Annual All Access subscription
Get image zoom dialog with Complementor
This module is included with all 1007 current Complementor solutions. Choose your production website allowance; every plan includes the same modules.
One website
$29USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $29 USD each year.
A few websites
$49USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $49 USD each year.
More websites
$99USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $99 USD each year.
Applicable taxes extra. Annual subscriptions renew automatically unless canceled in your customer account. Elementor Pro is required for Exclude current post. Read the terms and 14-day technical-issue refund policy.