Description
Kodlo Product Gallery for Elementor adds a WooCommerce-aware Elementor widget that can replace the standard WooCommerce product gallery inside product pages and product templates.
Create a structured multi-column desktop grid and switch to a touch-friendly mobile slider at the selected Elementor breakpoint. Product images, videos, variation-specific galleries, captions, links, lightboxes, sale badges, thumbnails, pagination, navigation, image effects, and optional image loading attributes are managed from one widget.
Kodlo reads the current WooCommerce product context on the frontend and uses an editor preview fallback when editing in Elementor. Gallery interactions use lightweight Vanilla JavaScript, with jQuery retained only for WooCommerce variation events. Frontend assets load through the widget dependency system, so base assets are requested only where the widget is used and optional magnifier or edge-bleed assets load only when those features are active on the frontend.
Built for Responsive Product Presentation
- Desktop Product Grid – Choose from 1 to 10 columns, control gaps and image limits, hide the featured image, randomize image order, or stretch the first or last unmatched grid item across all columns.
- Mobile Swiper Gallery – Use a main image slider, optional thumbnail carousel, infinite loop, configurable thumbnail count and gap, navigation arrows, and a limited sliding pagination window.
- Optional Swipe Edge Bleed – Preserve the mobile content gutter at rest, reveal slides through that gutter while dragging, and clip them at the screen edge. Configure the gutter and anchor navigation arrows to either the content edge or screen edge.
- Stable Thumbnail First Paint – The initial thumbnail row is laid out before Swiper initializes, reducing the full-width thumbnail flash and associated layout movement on mobile devices.
Product Media That Goes Beyond Images
- YouTube, Vimeo, and MP4 Video – Add a Video URL directly to an image in the WordPress Media Library. The image remains the poster and thumbnail while the gallery provides inline playback.
- Video Playback Controls – Configure desktop/mobile autoplay, mute and loop behavior, choose an Elementor play icon, and style its position, size, colors, hover animation, transition, and thumbnail indicator.
- Zoom and Magnifier Effects – Select None, Zoom, or Magnifier independently for desktop and mobile. Configure zoom strength, lens size, border, radius, and the accessible mobile magnifier toggle.
- Captions, Links, and Lightbox – Display attachment captions, link images to media files or attachment pages, and use Elementor lightbox behavior.
- Sale Flash – Display the WooCommerce sale badge in a preset or custom-styled position, with an optional link.
Variation Galleries Inside WooCommerce
Assign an ordered image gallery to each product variation from the standard WooCommerce variation editor. Images can be added, removed, reordered by drag and drop, or moved with accessible ordering controls.
On the storefront, Kodlo supports both complete and partial variation matching. The gallery can respond as soon as a meaningful attribute such as color is selected. Payload fingerprints prevent unnecessary DOM and Swiper rebuilds when the effective visible gallery has not changed, reducing flicker between equivalent variations.
Variation galleries can be enabled or disabled for the widget as a whole, while desktop and mobile views each keep their own maximum image limit.
Styling in Elementor
- Independent desktop, mobile, thumbnail, pagination, navigation, caption, sale badge, video, zoom, and magnifier controls.
- Aspect-ratio and object-fit presets for desktop images, mobile images, thumbnails, and stretched grid items.
- Normal, hover, and active states for borders, colors, backgrounds, opacity, and radius where applicable.
- Elementor icon library support for navigation, video, and mobile magnifier controls.
- Elementor Global Color-compatible color controls.
Performance and Accessibility Foundations
- Uses native image dimensions,
srcset, andsizesattachment data to reserve media space. - Includes an optional Image Loading Optimization control, disabled by default, for setting per-context priority image counts in the desktop grid, mobile slider, and mobile thumbnails.
- When enabled, priority images receive
fetchpriority="high"anddecoding="async"; remaining rendered images receiveloading="lazy"anddecoding="async". - Skips variation gallery rebuilds when the visible image payload is unchanged.
- Cleans up disconnected Swiper instances and scopes runtime state to each widget.
- Includes semantic buttons, localized labels, keyboard-enabled Swiper navigation, visible
:focus-visiblestyles, descriptive video titles, and hidden-state handling for limited pagination dots. - Respects
prefers-reduced-motionby disabling gallery transitions where appropriate.
Accessibility depends on the complete page, theme, content, colors, and configuration. Kodlo provides accessibility-focused foundations but does not claim automatic compliance for every implementation.
WooGallery Compatibility
Kodlo includes an optional, non-destructive compatibility layer for WooGallery metadata. It can read and lazily migrate video URLs stored in wcgs_video and variation image lists stored in woo_gallery_slider without deleting the original values.
Installation
- Upload the plugin files to the
/wp-content/plugins/kodlo-product-gallery-for-elementordirectory, or install the plugin through the WordPress plugins screen. - Activate the plugin through the ‘Plugins’ screen in WordPress.
- Ensure both WooCommerce and Elementor (Free or Pro) are installed and activated.
- Open a WooCommerce product page or Elementor Single Product template, search for Kodlo Product Gallery in the widgets list, and drag it into your layout.
FAQ
-
Does it require Elementor Pro?
-
The widget itself works with Elementor Free or Pro, but it needs a WooCommerce product context on the frontend. Place it on a product page or inside a Single Product template. Building Single Product templates with Elementor Theme Builder requires the relevant Elementor Pro functionality.
-
Can I use it on a normal non-product page?
-
Only when that page has a valid WooCommerce product context. The frontend renderer looks for the current WooCommerce product and does not output a gallery when no product can be resolved. In the Elementor editor, the preview can fall back to the first product so the widget remains editable.
-
Does it support variable WooCommerce products?
-
Yes. Assign galleries in the WooCommerce variation editor. Kodlo supports complete variation events and partial matching while attributes are being selected.
-
How do I attach videos to my gallery?
-
Open an image in the WordPress Media Library, enter a YouTube, Vimeo, or direct MP4 URL in the Video URL field, and save the attachment. The image becomes the video poster and gallery thumbnail.
-
How does Mobile Swipe Edge Bleed work?
-
Enable Swipe Edge Bleed in the widget’s General settings section. Match Mobile Side Gutter to the horizontal mobile padding around the gallery. Slides remain inside the content gutter at rest, can travel through it while swiping, and are clipped again after the slider snaps. Navigation Arrows Edge applies the same content-edge or screen-edge anchor to both main and thumbnail arrows.
-
Does the plugin include accessibility support?
-
Yes. Kodlo includes keyboard-enabled navigation, semantic buttons, localized labels, visible focus states, descriptive embedded-video titles, reduced-motion support, and pagination visibility management. Final accessibility still depends on the surrounding page, theme, content, colors, and widget configuration.
-
How is image loading optimized?
-
Kodlo always outputs attachment dimensions and responsive image data. By default it does not add custom
loading,fetchpriority, ordecodingattributes. If Image Loading Optimization is enabled, the configured first images in the desktop grid, mobile slider, and mobile thumbnails receivefetchpriority="high"anddecoding="async", while the remaining rendered images receiveloading="lazy"anddecoding="async". -
Does it import data from WooGallery?
-
Yes. The optional compatibility layer checks WooGallery video URLs (
wcgs_video) and variation gallery image lists (woo_gallery_slider). It can migrate values to Kodlo metadata without deleting the original data.
Reviews
There are no reviews for this plugin.
Contributors & Developers
“Kodlo Product Gallery for Elementor” is open source software. The following people have contributed to this plugin.
ContributorsTranslate “Kodlo Product Gallery for Elementor” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
2.9.0
- Feature: Fully documented inline style usage with robust justification comments and PHPCS ignores to comply with WordPress.org guidelines.
- Fix: Added pre-initialisation slide margin rule to match Swiper’s default gap on mobile, preventing adjacent slide slivers from peeking through due to subpixel rendering before Swiper boots.
2.8.1
- Fix: Fixed pagination pre-initialisation height rule to prevent double-spacing margin layout shifts when Swiper loads.
- Fix: Neutralised CSS grid gap on mobile flex wrapper to prevent cumulative Swiper slide offset during swiping.
- Verification: Confirmed independent device settings for image zoom/magnifier, and validated grid layout locking (disabling swiping gestures) on desktop viewports.
2.8.0
- Optimization: Unified the desktop grid and mobile slider into a single Swiper HTML container structure to prevent grid flashing (FOUC) on mobile devices, eliminate duplicate DOM nodes, and support dynamic custom breakpoints.
- Fix: Restored clean, standard inline dynamic CSS tag rendering inside widget markup for instant layout parsing and FOUC prevention.
- Fix: Generated visibility and layout rules dynamically using configured Elementor breakpoints instead of static media queries.
- Fix: Neutralised CSS grid gap on mobile flex wrapper to prevent cumulative Swiper slide offset during swiping.
- Fix: Added pre-initialisation full-width slide rule to prevent adjacent slide slivers from peeking through before Swiper loads.
- Fix: Restored original mobile edge-bleed CSS with clip-path idle/active transitions and wrapper stretching, fully compatible with the unified structure.
- Fix: Removed static slide display/width overrides from the global stylesheet and moved them into desktop-only dynamic CSS.
- Fix: Removed inline display grid style override from JavaScript boot and simplified device-range detection.
- Fix: Updated hover magnifier script selectors and device checking to support the unified slider container.
- Fix: Solved JavaScript syntax error (unexpected token ‘)’) in frontend widget script.
- Compatibility: Updated Elementor desktop style controls to map gap, border-radius, lens, and border settings to the new unified classes.
- Compliance: Replaced fallback dynamic CSS output in wp_footer with a fully-compliant enqueued virtual stylesheet using wp_add_inline_style.
- Maintenance: Renamed translation files (uk, de_DE) to match the correct text domain
kodlo-product-gallery-for-elementor. - Fix: Added missing resource version parameter to virtual stylesheet registration to prevent caching warnings.
- Clean: Reviewed stylesheet for dead code or duplicates.
2.7.9
- Feature: Added “View details” link in the plugin row meta on the Plugins list page.
- Compliance: Replaced inline
<style>tag withwp_add_inline_style()+wp_footerfallback for per-widget dynamic CSS – addresses WordPress.org enqueue guidelines. - Compliance: Added
esc_attr()escaping to all boolean ternary outputs in HTML attributes and class values. - Fix: Removed UTF-8 BOM from all PHP files – fixes “15 characters of unexpected output during activation” error and stray characters in rendered HTML.
- Compliance: Added
woocommerceto theRequires Pluginsheader so WordPress 6.5+ enforces both Elementor and WooCommerce as required dependencies before activation. - Maintenance: Renamed plugin folder and main file to
kodlo-product-gallery-for-elementorto match the WordPress.org plugin slug. - Maintenance: Updated translation files (uk, de_DE) to version 2.7.9 with new “View details” strings.
2.7.8
- Maintenance: Unified ABSPATH security guard to
defined( 'ABSPATH' ) || exit;across all PHP files, replacing the multi-lineif-block form used in include files. - Maintenance: Renamed all PHP include files to carry the
kodlo-elementor-gallery-prefix, consistent with WordPress plugin naming conventions and easier to identify during profiling. - Maintenance: Renamed all JS and CSS asset files to include the
kodlo-elementor-gallery-prefix for easier identification in browser developer tools. - Fix: Removed duplicate Ukrainian translation files (
uk_UA.po/uk_UA.mo) – the correct WordPress locale for Ukrainian isuk, notuk_UA; the files were never loaded by WordPress. - Maintenance: Added missing POT translation template file (
kodlo-elementor-gallery.pot). - Cleanup: Removed orphaned
mobile-edge-bleed.phpcontrols file – its controls had been merged into General settings in a previous release but the file was not removed.
2.7.6
- Fix: Merged separate Product Variations toggles (desktop/mobile) into a single control in General settings – the setting was split but both desktop and mobile always mirrored the same intent; the unified control removes the redundancy and the two orphaned description strings from translations.
2.7.5
- Cleanup: Normalized boolean data attributes – show_pagination, mute_videos, loop_videos, loop_mobile now use yes/no strings consistent with all other boolean attributes; removed the dataBool() helper that existed solely for the old true/false format.
- Fix: Moved Featured Image toggle from Desktop view settings to General settings – the control was conditioned on desktop view being enabled but its logic applied to both desktop grid and mobile slider; it is now always visible and correctly reflects its global scope.
2.7.4
- Feature: Added Image Loading Optimization setting in General settings – disabled by default. When enabled, exposes configurable per-context priority image counts: desktop grid, mobile slider, and mobile thumbnails separately. First N images receive fetchpriority=”high” decoding=”async” (LCP), remaining images receive loading=”lazy” decoding=”async”. When disabled, no loading attributes are added.
2.7.3
- Perf: Gallery images now carry correct loading optimization attributes – the first image in the desktop grid and mobile slider each receive fetchpriority=”high” and decoding=”async” (no lazy loading) to support LCP, while all remaining gallery images and all thumbnail images receive loading=”lazy” and decoding=”async”. Attributes are set explicitly rather than relying on WordPress or Elementor counters, which may already be consumed by other page elements before the gallery renders.
2.7.2
- Fix: Mobile slider slides are no longer clipped in the Elementor editor – Elementor Pro’s widget-nested-carousel.min.css applies overflow:hidden via .swiper-container:not(.swiper-container-initialized), but Swiper 8 only adds swiper-initialized (not the Swiper 6 legacy class). After Swiper initializes, the legacy class is now added to both the main and thumbnails slider elements to neutralize the conflicting rule.
2.7.0
- Fix: Added missing translators comments for esc_html__() calls with %d placeholder in widget-render.php – split ternary into if/else so each comment sits immediately above its translation call.
2.6.9
- Fix: Pagination dots and magnifier button now reinitialize correctly after changing widget settings in the Elementor editor – moved elementorFrontend.hooks.addAction registration inside jQuery(window).on(‘elementor/frontend/init’) so it runs after elementorFrontend.init() completes and hooks are guaranteed to be available. The previous synchronous check ran before init() and silently skipped registration.
- Cleanup: Removed orphaned var renderedMaxImages declaration left over from the 2.6.8 dead-code removal.
2.6.8
- Cleanup: Removed no-op on.init Swiper callback for updateLimitedPagination – the call fired synchronously before browser paint so getBoundingClientRect always returned 0; the requestAnimationFrame call below it is the sole effective path.
- Cleanup: Removed dead code branch in initializeGallery – currentMaxImages and renderedMaxImages both read from the same PHP data attributes so the condition was always false.
2.6.7
- Fix: Pagination dots and magnifier button now appear immediately after changing widget settings in the Elementor editor – added elementorFrontend.hooks.addAction for frontend/element_ready directly in frontend.js (inside the preview iframe context) so the hook registration and dispatch share the same hooks object. Registration is guarded with isEditMode() so production frontend is unaffected.
2.6.6
- Fix: Resolved Swiper instance leak in the Elementor editor – getInstanceKey now uses the stable widget data-gallery-id so destroyMobileSwiper correctly cleans up the previous instance on every re-render instead of accumulating orphaned Swiper objects with live window/document listeners.
- Fix: Corrected the editor reinit debounce – the timer is now stored on the stable scope element rather than the replacement wrapper element, so rapid setting changes are properly debounced and the wrapper lookup is deferred until the timer fires to always target the current DOM node.
- Fix: Replaced the window load wrapper for element_ready hook registration with a DOMContentLoaded + load dual listener and a registered guard, ensuring the hook is always registered at the earliest safe moment.
2.6.5
- Fix: Pagination dots now appear immediately after widget re-init – deferred the initial updateLimitedPagination call to requestAnimationFrame so bullet dimensions are measured after browser paint rather than synchronously during Swiper construction.
2.6.4
- Fix: Pagination dots no longer disappear after changing Thumbnails Per View or other settings in the Elementor editor – stale bullet DOM is now cleared before re-initializing Swiper (editor only).
- Fix: Magnifier now activates immediately after widget settings change in the editor without requiring a viewport switch – refresh is called after Swiper finishes creating its slides (editor only).
- Fix: All mobile slider images now load reliably after a settings change in the editor – Swiper preloadImages and updateOnImagesReady options are enabled on reinit (editor only).
- Fix: Rapid successive widget setting changes in the editor now trigger only a single gallery reinit – a 150 ms debounce prevents redundant reinit calls from the Elementor element_ready hook (editor only).
2.6.3
- Performance: Magnifier CSS and JS (magnifier.css ~4.5 KB, magnifier.js ~9.5 KB) are now loaded only when the Magnifier image effect is selected for desktop or mobile view – saving ~14 KB on every gallery instance that does not use magnifier.
- Performance: Edge Bleed CSS and JS (edge-bleed.css ~1.2 KB, edge-bleed.js ~1.6 KB) are now loaded only when Mobile Edge Bleed is enabled – saving ~2.8 KB on instances that do not use the feature.
- Performance: Removed magnifier.css and edge-bleed.js from the hard dependency chains of frontend.css and frontend.js so that the base styles and scripts no longer pull in feature-specific assets unconditionally.
- Maintenance: In the Elementor editor and preview context all assets are still loaded unconditionally so that live setting changes take effect immediately without a page reload.
2.6.2
- Fix: Resolved horizontal page scroll caused by overflowing adjacent Swiper slides in Edge Bleed mode. The wrapper now expands into the gutter (overflow-x:clip prevents scroll) while slider-wraps are pulled back to content column width via compensating margins, so images do not stretch and screen-edge nav arrows remain within the clipping boundary.
2.6.1
- Fix: Replaced the wrapper-expansion Edge Bleed layout with a clip-path-only approach – the gallery wrapper stays at content column width, and adjacent Swiper slides bleed through via overflow:visible and a negative-inset clip-path transition, eliminating the image and thumbnail stretching introduced in 2.6.0.
2.6.0
- Fix: Replaced the Edge Bleed margin/padding layout technique with a position-relative offset and explicit width calculation, eliminating the visible right-side gap that appeared on width:100% elements inside Elementor columns.
- Fix: Edge Bleed structural CSS now applies only when mobile view is enabled; the media query is omitted when desktop view is disabled so Edge Bleed works correctly in mobile-only mode at all widths.
- Fix: Mute Videos control now hides only when Autoplay is set to Both; the control remains visible for Desktop-only or Mobile-only autoplay so the manual mute setting can apply to the view without autoplay.
- Fix: Corrected the mute render logic so autoplay forces mute only when set to Both, matching the updated control visibility behavior.
- Enhancement: Moved the Navigation Arrows Padding control outside the Normal/Hover tabs and placed it directly after Icon Size for both Main Slider and Thumbnails arrow groups.
- Change: Desktop View Settings is now the first section in the Content tab; General Settings moved to the end.
- Change: Desktop Style Settings is now the first section in the Style tab (no top separator); General Style Settings moved to the end.
- Maintenance: Removed columnar alignment spaces from variable assignments across all plugin PHP files.
- Maintenance: Simplified the mobile breakpoint fallback from a multi-line Elementor API block to a single null-coalescing expression with a 768px default.
2.5.6
- Fix: Corrected the Normal, Hover, and Active pagination dot color variables so widget colors and Elementor Global Colors reach the frontend styles.
- Fix: Routed pagination dot colors exclusively through widget-scoped CSS variables while retaining theme-resistant frontend priority.
- Maintenance: Removed unused maximum-dot and positive Edge Bleed gutter CSS variables.
2.5.5
- Change: Replaced the Navigation Style and Video Style tabs with conditionally displayed labeled control groups.
- Change: Moved Video Icon on Thumbnails from Mobile View Options to Video Options.
- Fix: Strengthened pagination dot styles against theme overrides and prevented hover styles from overriding the active dot.
- Translation: Removed obsolete tab labels and synchronized German and Ukrainian catalogs.
2.5.4
- Enhancement: Reorganized Video Style settings into conditionally displayed Gallery and Thumbnail tabs while preserving existing control values.
- Change: Updated mobile magnifier button defaults to an 18px icon, top-right position, 10px padding, zero margin, and a 20px bottom-left radius.
- Enhancement: Moved mobile pagination dot styles into Navigation Style and separated image, thumbnail, and dot navigation controls.
- Enhancement: Moved mobile navigation content controls into a dedicated Navigation section and control file.
- Change: Consolidated main and thumbnail Edge Bleed arrow anchoring into one Navigation Arrows Edge setting.
- Translation: Synchronized German and Ukrainian catalogs with all current plugin strings and rebuilt the MO files.
- Maintenance: Completed a release audit of controls, runtime attributes, metadata keys, translations, and packaged assets.
2.5.3
- Change: Removed the Edge Bleed Exit Direction option and its outward mask animation, retaining the standard reverse animation.
- Change: Removed the Transition Easing option and standardized Edge Bleed transitions on
ease-out. - Enhancement: Kept separate configurable reveal and hide durations for Edge Bleed animations.
- Fix: Unified the selected Elementor video icon across video posters and video thumbnails, including variation gallery rebuilds.
2.5.2
- Enhancement: Added separate reveal and hide durations for Mobile Edge Bleed, both defaulting to 200ms.
- Feature: Added Reverse Inward and Continue Outward exit directions for side images after a swipe.
2.5.1
- Feature: Added a separately configurable active magnifier button icon, with a search-minus icon as the default.
- Enhancement: Added configurable duration and easing for smooth Mobile Edge Bleed appearance and disappearance.
- Fix: Replaced unsupported nested Elementor tabs in the mobile magnifier button controls with clear state headings.
2.5.0
- Feature: Added optional Mobile Swipe Edge Bleed for the main slider and thumbnail carousel, disabled by default.
- Feature: Added a configurable Mobile Side Gutter with a 30px default and independent Content Edge or Screen Edge anchoring for main and thumbnail overlay arrows.
- Performance: Added a pre-Swiper thumbnail layout for the configured 2-5 thumbnails per view, reducing the initial full-width thumbnail flash and mobile layout movement.
- Change: Removed plugin-specific LCP controls and custom
fetchpriority,loading, anddecodingoverrides so Elementor and WordPress can manage page-level image loading optimization. - Markup: Removed empty inline style attributes and output
data-video-urlonly for gallery items that contain video. - Maintenance: Moved edge bleed controls, behavior, and styles into dedicated PHP, JavaScript, and CSS modules and added concise CSS section comments.
- Documentation: Rebuilt the plugin description, feature overview, FAQ, screenshots, and accessibility wording around the current implementation.
2.4.1
- Enhancement: Added an optional, styleable video indicator to mobile thumbnails.
- Enhancement: Changed the maximum visible dots setting to an integer slider from 2 to 10.
- Enhancement: Clarified that thumbnail width applies to Auto mode and kept thumbnail gap configurable in every mode.
- Enhancement: Standardized the video icon transition duration at 0.3 seconds and enforced a transparent video placeholder.
- Enhancement: Added Lens and Button tabs with full mobile magnifier toggle icon, layout, normal, and hover styling controls.
- Fix: Kept the pagination fade inside the exact configured dot window so adjacent dots no longer leak into view.
- Fix: Ensured active pagination colors and borders take priority while hovering the active dot.
2.4.0
- Feature: Added configurable Zoom Factor slider (0-3x) for both desktop and mobile Zoom effects, replacing the fixed 1.08x scale.
- Feature: Added configurable Zoom Factor slider (0-3x) for both desktop and mobile Magnifier effects, replacing the hardcoded 2x zoom level.
- Feature: Added Lens Size slider (px) for both desktop and mobile Magnifier effects, with independent defaults (160px desktop, 140px mobile).
- Feature: Added Lens Border Style, Border Width, Border Color, and Border Radius controls for both desktop and mobile Magnifier effects.
- Enhancement: All zoom and magnifier values are now stored as CSS variables scoped to each widget instance, ensuring independent settings across multiple widget placements.
- Fix: Migrated dot color controls (normal, hover, active – background and border) to CSS variable selectors, ensuring Elementor Global Colors are respected correctly instead of being overridden by the base stylesheet’s !important declarations.
2.3.0
- Feature: Added mutually exclusive None, Zoom, and Magnifier image effects with independent desktop and mobile settings.
- Enhancement: Added a lazy-loaded desktop pointer lens and an accessible mobile magnifier toggle with drag interaction.
2.2.1
- Fix: Restored the Video URL field after Description in WordPress media attachment sidebars and preserved native compatibility-field saving.
2.2.0
- Enhancement: Modular refactoring of the monolithic widget-controls.php file into 11 sub-files organized by tab and section.
- Enhancement: Modular refactoring of the main plugin file kodlo-elementor-gallery.php into sub-files organized by functional zone.
- Documentation: Standardized all codebase documentation, replacing inline comments with fully typed PHPDoc block comments.
- Maintenance: Verified code syntax and plugin initialization performance.
2.1.0
- Feature: Added separate autoplay settings for Desktop, Mobile, Both, or None.
- Feature: Added standard Elementor hover animations support for the video play button.
- Enhancement: Standardized thumbnail default settings (border radius: 0px, gap: 10px, min size: 80px).
- Enhancement: Converted active/inactive thumbnail border width controls to multi-sided dimension controls.
- Enhancement: Added a visual divider and a dedicated heading for Thumbnails inside Mobile view options, with variation settings repositioned above them.
- Fix: Adjusted mobile Swiper pagination track linear gradient fade padding boundary so leftmost dots remain clear and readable.
- Fix: Prevented Stretched Image Style settings from rendering when Stretched Image is disabled.
- Localization: Added complete German and Ukrainian translations for new controls and options.
2.0.0
- Feature: Added CSS mask-image linear gradients to smoothly fade mobile pagination dots at viewport edges.
- Enhancement: Added Caption typography, text color, background, border, border color, and border-radius controls.
- Fix: Prevented the WooCommerce variation “Add Gallery Images” button from remaining hidden after removing all images.
- Fix: Preserved empty variation gallery states and resolved recurring lazy compatibility migrations by updating metadata values to empty strings instead of deleting keys.
- Fix: Protected variation gallery metadata against accidental deletions during WooCommerce variation quick/bulk edits.
- Fix: Forced the video play button background to remain transparent in normal, hover, focus, and active states.
- Optimization: Restricted lazy-compatibility migration checks to metadata existence queries, keeping the original WooGallery metadata intact in the database.
- Performance: Reused normalized attachment data across product and variation galleries during each request.
- Specificity: Prefixed Swiper pagination selectors and enhanced Elementor controls to target bullet elements directly with wrapper specificity and !important declarations, ensuring proper rendering on pages with theme overrides.
- Localization: Updated German and Ukrainian translations and removed obsolete control strings.
- Maintenance: Reviewed PHP, JavaScript, styles, metadata, and release assets.
1.9.0
- Change: Simplified all widget controls to one static value per setting instead of device-specific values.
- Change: Limited the mobile-view breakpoint selector to active Elementor breakpoints.
- Change: Kept separate static maximum-image limits for desktop and mobile galleries.
- Change: Allowed a minimum of two thumbnails per view and removed click-and-hold image inspection.
- Performance: Batched variation attachment metadata and narrowed variation editor DOM scans.
- Fix: Isolated runtime settings and gallery updates to each widget instance.
- Fix: Clipped mobile Swiper overflow so adjacent slides remain hidden.
- Fix: Saved newly added variation images and persisted complete variation gallery removal.
- Enhancement: Added a smooth, single-row sliding window for limited pagination dots.
- Enhancement: Added independent Normal, Hover, and Active color and border controls for pagination dots.
- Enhancement: Added mutually exclusive Desktop-only and Mobile-only view modes.
1.6.9
- Fix: Resolved responsive Swiper preview and layout issues when emulating mobile devices in browsers.
- Fix: Updated inline stylesheet selector to match the element directly, ensuring styling is applied under all page render contexts.
1.6.8
- Fix: Resolved mobile responsiveness issue where Swiper instances disintegrated due to continuous re-initialization on scroll-induced address bar resizes.
- Fix: Restored Swiper pagination dots and arrows display and behavior on mobile views.
- Fix: Corrected Elementor editor preview rendering loop and resolved race condition in initialization.
- Optimization: Secured layout property lookups against null/undefined values to prevent JS errors.
1.6.7
- Performance: Skipped DOM and Swiper rebuilding when a newly selected variation has the same visible desktop and mobile gallery images.
- Fix: Prevented gallery flicker when switching between variations that share an identical ordered image set.
1.6.6
- Enhancement: Moved the Video URL editor into the native attachment details panel, before later compatibility sections such as Folders, while preserving standard WordPress attachment saving.
1.6.5
- Enhancement: Added Elementor responsive inheritance to the remaining device-dependent layout and position controls.
- Enhancement: Added responsive thumbnail count, pagination limit and position, stretched image layout, Sale Flash position, and video icon position and transition.
- Fix: Applied inherited responsive values at runtime when Swiper or grid behavior depends on the selected device value.
1.6.4
- Performance: Reused one partial variation match across multiple gallery widgets instead of rescanning the product variations for every instance.
- Fix: Applied the responsive thumbnail gap at runtime while retaining the server-rendered value as a fallback.
1.6.3
- Fix: Restored stable partial variation matching without gallery flicker or premature fallback on incomplete selections.
- Fix: Restored the proven mobile Swiper and thumbnail structure to prevent horizontal overflow, full-width thumbnails, and missing pagination dots.
- Enhancement: Moved the image Video URL field before later media-sidebar compatibility fields such as Folders.
1.6.2
- Fix: Added responsive inheritance to device-dependent style controls throughout the Elementor widget.
- Fix: Increased instance-scoped style priority for borders, hover states, radii, thumbnails, navigation arrows, sale flashes, and pagination dots.
- Fix: Strengthened pagination dot overrides against default Swiper styles while preserving unique styling for every widget instance.
1.6.1
- Enhancement: Removed thumbnail position settings and standardized thumbnails below the main mobile slider.
- Enhancement: Restored image-only WooCommerce product and variation gallery selection; videos remain available through the Video URL field attached to image files.
- Fix: Restricted the Video URL field and gallery data to supported image attachment formats.
- Fix: Restored WooCommerce variation gallery switching across partial and complete attribute selections.
- Enhancement: Added responsive inheritance to applicable size, gap, border, navigation, thumbnail, and video icon controls.
1.6.0
- Feature: Added partial WooCommerce variation matching that updates galleries on first attribute change.
- Feature: Prevented MediaElement JS crash by appending mejs-container class to all custom video player nodes.
- Enhancement: Cleaned up Elementor widget settings, renamed stretched image settings, and replaced custom aspect ratios with predefined options.
- Fix: Resolved Elementor editor live-refresh Swiper layout disintegration by delay-reinitializing slider instances.
1.5.0
- Feature: Added option to stretch either the first or last grid item to span full width when grid columns are not multiple.
- Fix: Restored compatibility with WooCommerce core script (
meta-boxes-product.js) by properly preserving all originalwp.mediaproperty descriptors and prototype. - Fix: Fixed product page variation gallery image updates when switching variations that only have a featured image without custom variation galleries.
- Enhancement: Styled the variation gallery delete buttons to match native WooCommerce product image delete buttons (hidden by default, appears on hover in top-right corner as a white circle with a shadow, turns red on hover).
1.4.0
- Fix: Resolved all reported PHPCS and WordPress VIP lint errors.
- Localization: Added Ukrainian and German translation support (PO/MO files).
1.3.0
- Feature: Added automatic, lazy, non-destructive WooGallery compatibility layer (imports videos and variation galleries on-the-fly).
- Enhancement: Code comments cleaned up to adhere to strict single-line format rules.
1.2.0
- Accessibility: Added semantic frontend gallery navigation, keyboard support, labels, and focus styles.
- Feature: Custom play icon selection, sizing, coloring, and 9 play button placement presets.
- Feature: Custom navigation arrow icon selection, positioning, and hover styling.
- Feature: Added automatic, lazy, non-destructive WooGallery compatibility layer (imports videos and variation galleries on-the-fly).
- Performance: Gallery interactions rewritten in Vanilla JavaScript, retaining jQuery only for WooCommerce variation events.
- Enhancement: Added partial variation gallery matching upon first attribute click.
- Enhancement: Added Elementor breakpoint max-images responsive settings.
- Compatibility: Tested up to WooCommerce 8.x and Elementor 3.x.
1.1.0
- Enhancement: Added last-image full grid spanning option.
- Enhancement: Separate desktop/mobile settings to toggle variation product galleries.
- Fix: Removed duplicate featured image displaying in variation galleries.
1.0.0
- Initial Release.