SazKit – Product Gallery for WooCommerce

SazKit – Product Gallery for WooCommerce swaps the default WooCommerce single-product image gallery (FlexSlider + zoom) for a clean Swiper slider.

Features:

• Main slider with arrow and dot navigation, fade transition, and adaptive height.
• Optional synced thumbnail navigation slider below the main image.
• Full-screen lightbox with keyboard navigation, focus trapping, and click-to-magnify.
• Hover zoom (inner magnify) on the main image for desktop pointers.
• Configurable gallery height — a fixed pixel height (default 550px) that scales images down and centers them, or auto height that fits each image.
• Image fit for fixed-height mode — Contain (show the whole image) or Cover (fill and crop edge-to-edge).
• Configurable thumbnail count (1–10 visible at once).
• Toggle arrows and dots independently on the main slider.
• Optional arrows on the thumbnail slider.
• Autoplay for the main slider with a configurable interval (pauses on hover/focus).
• Tabbed settings screen: General and Style.
• Style tab: pick the arrow color and dot color with the native color picker.
• Variation support — the main image updates when a variation with its own image is selected.
• RTL aware.
• Uses your site’s existing Swiper assets if a theme or another plugin already registers them; otherwise it loads its own bundled copy.
• HPOS (High-Performance Order Storage) compatible.
• Developer friendly: filter hooks for the image IDs, image sizes, and Swiper arguments.

Filter hooks

• sazkit_settings — filter merged plugin settings at runtime.
• sazkit_gallery_image_ids — filter the attachment IDs used in the gallery.
• sazkit_main_image_size / sazkit_thumb_image_size — filter the registered image sizes.
• sazkit_swiper_main_args / sazkit_swiper_thumbs_args — filter the Swiper configuration.
• sazkit_swiper_handles — override the detected Swiper script/style handles.
• sazkit_zoom_level — filter the hover-zoom magnification factor (default 2.0).
• sazkit_slide_badges — filter to add badge overlays (e.g. Sale/New ribbons) to a gallery slide.
• sazkit_before_main_slides / sazkit_after_main_slides — actions for add-ons to inject extra .sazkit-slide elements (e.g. video) into the main slider.
• sazkit_before_thumb_slides / sazkit_after_thumb_slides — matching actions for the thumbnail slider, to keep both sliders’ indexes in sync.
• sazkit_gallery_wrapper_classes — filter to add extra classes to the gallery wrapper (e.g. add-on layout classes).
• sazkit_disable_main_slider — filter to skip Swiper initialization entirely, for add-ons rendering their own layout (e.g. a grid).
• sazkit_main_image_attrs / sazkit_thumb_image_attrs — filter the <img> attributes per slide (e.g. lazy-loading control).

• sazkit_main_image_html / sazkit_thumb_image_html — filter the final <img> HTML per slide (e.g. to wrap it in a <picture> element for WebP/AVIF).

  render_gallery_for_product( WC_Product $product ) and enqueue_gallery_assets() are public methods add-ons can call directly to render/enqueue the gallery for an arbitrary product outside the single product page (e.g. a shortcode or block).

• sazkit_settings_nav_tabs — action to add extra tab links to the settings page’s nav (so an add-on doesn’t need its own separate admin menu item).

• sazkit_settings_panels — action to render extra tab panel(s) inside the settings card, after the built-in General/Style tabs’ own <form> closes. Forms can’t nest, so add-on panels needing to save fields must wrap themselves in their own <form> with their own save button — the built-in Cancel/Save changes footer only submits the General/Style tab and hides itself automatically while a non-native tab is active. Panels should use the same .sazkit-tab-panel / #sazkit-tab-{slug} markup convention as the built-in tabs so the shared tab-switching JS shows/hides them correctly.

The gallery wrapper also fires two jQuery events add-ons can listen for: sazkit:zoom (hover zoom activated on a slide) and sazkit:lightbox-open (the lightbox opened for a slide), both passed the attachment ID.

Third-Party Libraries

This plugin bundles the Swiper library (v11.2.10) by Vladimir Kharlampidi, licensed under the MIT license. See https://swiperjs.com.