Reel - Product Gallery Zoom & Video for WooCommerce
| 开发者 | motylanogha |
|---|---|
| 更新时间 | 2026年10月24日 14:43 |
| PHP版本: | 8.1 及以上 |
| WordPress版本: | 7.1 |
| 版权: | GPLv2 or later |
| 版权网址: | 版权信息 |
详情介绍:
Reel upgrades the WooCommerce single product gallery with product image zoom, an accessible gallery lightbox and a featured product video:
- Hover zoom. Gallery images magnify on hover at a zoom scale you set (1.0× to 3.0×). The transform is clipped to the gallery frame, so the rest of the page stays put. On touch screens, two fingers pinch the image to zoom; a double tap or moving to another slide puts it back, and one finger still scrolls and swipes.
- Accessible lightbox. Click, or press Enter/Space, on any gallery image to open its full-size file full screen. Arrow buttons, the Left and Right keys or a swipe step through every gallery image, with an "Image 2 of 5" counter read out to screen readers. Tab stays inside the lightbox so focus can't slip behind the overlay, Escape closes it, and focus returns to the image you opened. It's a fixed overlay that starts hidden, so it reserves no space until used.
- Featured video. Show a per-product video, a self-hosted MP4/WebM file or a
YouTube/Vimeo (oEmbed) URL, after the gallery, before the product summary, or
in the gallery itself as the last slide with a play thumbnail.
The video sits in a 16:9 frame sized with
aspect-ratio, so its space is held before it loads. YouTube and Vimeo show a poster and a play button; the player loads only when the shopper presses play, and YouTube plays from youtube-nocookie.com.
[reel_video]
shortcode (it takes id and title attributes) into any product content. It
renders the current product's video in the same 16:9 frame.
Source and issue tracker: github.com/wppoland/plogins-reel, the plugin is
developed in the open, so bug reports and pull requests are welcome there.
Documentation and links
- Documentation: plogins.com/reel/docs/
- Plugin page: plogins.com/reel/
- Source code: github.com/wppoland/plogins-reel
- Bug reports and feature requests: github.com/wppoland/plogins-reel/issues
- Gallery image hover zoom with a configurable scale.
- Two-finger pinch zoom on touch screens.
- Accessible, keyboard-operable full-screen lightbox (Escape / backdrop close).
- Featured product video (self-hosted or oEmbed) with selectable position.
- Click-to-play poster for YouTube and Vimeo, so the player loads only on demand.
[reel_video]shortcode to place the video anywhere.- Optional lightbox caption from the image alt text.
- Skip hover zoom on touch devices (where hover is unreliable).
- Custom accessible label for the open-in-lightbox control.
- Default video heading and optional intro paragraph.
- Reserved-space markup throughout, so no Cumulative Layout Shift.
- No jQuery; deferred, in-footer scripts loaded only where they are needed.
- Independent on/off toggle for each feature.
- "Settings" link on the plugins list; clean uninstall removes plugin options.
- Fully translatable: ships the
plogins-reel.pottemplate, with Polish, German and Spanish delivered by the WordPress.org language pack. - HPOS and cart/checkout blocks compatible.
安装:
- Upload the plugin to
/wp-content/plugins/plogins-reel, or install via Plugins > Add New. - Activate it. WooCommerce must be active.
- Go to the Reel menu and enable the features you want.
- For a product video, open a product, go to the Reel tab in the product data panel and paste the video URL.
屏幕截图:
常见问题:
Does it require WooCommerce?
Yes. Reel is a WooCommerce product gallery plugin and runs on single product pages.
Which video sources are supported?
Self-hosted files (MP4, M4V, WebM, OGV) are played with WordPress's native video player. Any oEmbed-supported URL (YouTube, Vimeo, etc.) is embedded automatically. YouTube and Vimeo start as a poster with a play button and load the player on click; with autoplay switched on they embed directly.
Does it use jQuery?
No. Reel ships vanilla JavaScript only, deferred and loaded in the footer: the gallery script on the single product page, and the click-to-play script where a YouTube or Vimeo video is shown.
Does Reel replace the WooCommerce product gallery?
No. Reel enhances the existing WooCommerce product gallery with image zoom, lightbox behaviour and optional product video.
Can I show a product video outside the gallery?
Yes. Use the [reel_video] shortcode to place the product video in custom product content.
Will it cause layout shift (CLS)?
No. The lightbox is a fixed overlay that starts hidden, the zoom transform is clipped to the gallery frame, and the video sits in a fixed-ratio frame that reserves its space before loading.
Is the lightbox keyboard accessible?
Yes. Shoppers can open images with Enter or Space, move between images with the arrow buttons or the Left and Right keys, close with Escape, and focus returns to the image that opened the lightbox.
Does this plugin work on WordPress Multisite?
Yes. This plugin is compatible with WordPress Multisite. Network activate it or activate it on individual sites; each site keeps its own settings and data.
更新日志:
1.1.0
- New: video position "In the gallery". The video becomes the last gallery slide with a play glyph on its thumbnail; picking it shows the click-to-play poster, and the player loads only on click. Autoplay does not apply in this position.
- New: the lightbox steps through all gallery images with arrow buttons, the Left and Right keys or a swipe, and announces "Image N of M".
- Fixed: the lightbox showed the gallery-size image; it now opens the full-size file.
- Fixed: on block themes, "Before the summary" printed the video above the breadcrumbs. It now sits in the gallery column, above the images.
- Fixed: with the video placed after the gallery, the YouTube poster sat too low in its frame and showed a black bar at the top. It now fills the frame.
- Translation template carries the new play button labels and the plugin's own support link.
- New: two-finger pinch zoom on the gallery image on touch screens. One finger still scrolls the page and swipes the slider; a double tap or a slide change resets the zoom. On with hover zoom.
- New: YouTube and Vimeo featured videos show a poster and a play button, and the player loads only when the shopper presses it. Nothing from the player is loaded for visitors who never play, YouTube plays from youtube-nocookie.com, and the poster fills the reserved 16:9 frame so nothing moves. With autoplay on, the player embeds directly as before.
- Security (low): the [reel_video] shortcode and the Reel featured video block showed the video and title of any product ID, including drafts, private and password-protected products. A contributor previewing a post could read them. They now show only products the visitor is allowed to see.
- Fixed: YouTube and Vimeo videos printed as an empty frame. The embed is an iframe, and the output filter removed it; only self-hosted files ever played.
- Fixed: on a product with gallery images, the video placed after the gallery landed inside the image slider, off to the side where nobody could reach it. It now sits under the images and thumbnails.
- Fixed: clicking a gallery image opened Reel's lightbox and WooCommerce's own lightbox at the same time on themes that enable WooCommerce's gallery features, which all default themes do. With Reel's zoom or lightbox switched on, WooCommerce's matching feature now steps aside, and the click no longer follows the link to the image file.
- Fixed: deleting the plugin left the cached video embeds of the shortcode and block in the database.
- The upgrade notice's "Coming soon" and "Get notified" labels are English source strings for every language; Polish sites used to get their own Polish source text, which translators in other languages then saw untranslated.
- Display name drops the "Plogins " prefix. The slug, the text domain and every option key are unchanged, so nothing on an existing install moves.
- The sidebar upgrade promo now follows the same dismissal as the banner. Dismissing the banner used to leave a full-height advert on the settings screen for good, which is not what the WordPress.org guideline on upgrade prompts means by used with moderation.
- Fixed: the PRO upgrade promo kept selling to people who had already bought the paid edition. Only the banner could be dismissed, so the sidebar promo and the locked feature cards followed a paying customer around for good. The promo now checks whether the paid edition is active and steps aside when it is.
- Fixed: arrow glyphs in the admin menu paths, and in the strings handed to translators. An arrow inside a translatable string makes the glyph every translator's problem and changes the layout in any locale that drops it.
- Changed: the PRO feature cards printed an arrow glyph in menu paths where the rest of the plugin and the documentation use a plain ">". Same navigation, one character that renders everywhere.
- Fixed: deleting the plugin left the per-user "dismiss" flag from the PRO notice in the database. Uninstall now removes it for every user, not just the one who dismissed it.
- The translation template was regenerated. 12 strings added to the plugin since the template was last built were missing from it, so no translator could reach them in any language, and 10 strings the plugin no longer uses have been dropped. Nothing you see changes; what a translator can see does.
- Fixed: the plugin reported an older version number internally than the one it was released under. That number versions the stylesheets and scripts the admin screen loads, so a browser holding the previous files kept them after an update instead of fetching the corrected ones.
- Declared compatibility with WooCommerce 11.0.
- Fixed the PRO promo on the settings screen quoting a price in PLN. PRO is priced and charged in EUR, so an admin on a Polish site was shown a zloty amount and then billed in euro, and the zloty figure was a fixed conversion that drifted from the real charge as the rate moved. The promo now shows the euro price that is actually taken.
- Corrected the PRO pricing line. It implied a second currency was available; there is none. PRO is priced and charged in EUR.
- The video heading now falls back to the built-in "Product video" text, as the setting always said it would. With "Show heading" on and the default heading left empty, the video on the product page showed no heading at all; only the shortcode got this right. Set your own text in Reel > Featured video, or turn "Show heading" off if you prefer none.
- Autoplay now really plays. The video is muted whenever autoplay is on, which is the only way browsers allow it, so a video that used to sit there paused starts on its own with the sound off until the shopper turns it up.
- Stopped advertising a block that could not be inserted. The plugin registered
reel/featured-videoserver-side only, with no block.json and no editor script, so it never appeared in the inserter, yet the readme and the settings screen told merchants to look for it. The[reel_video]shortcode does the same job and is unchanged.
- The featured video can now be set from the product editor. A Reel tab on the product data panel takes a YouTube, Vimeo or direct .mp4/.webm URL and an optional heading. The rendering side always shipped here, but nothing in the free plugin could fill those fields in, so the readme asked people to edit a meta field by hand. That was a feature with its interface missing, and it is fixed by adding the interface rather than by removing the feature.
- The package no longer ships .po and .mo files. Translations for plugins hosted on WordPress.org come from translate.wordpress.org, which generates and delivers them per locale. The .pot template stays, since that is what translators import.
- Translations: completed Polish, German and Spanish for the PRO upgrade panel.
- Restored the distinctive display name: Plogins Reel - Product Gallery Zoom & Video for WooCommerce.
- Fixed low-contrast admin headings under an OS dark-mode preference.
- Clearer name: Plogins Reel - Product Gallery Zoom & Video for WooCommerce.
- Added bundled Polish, German and Spanish translations for the plugin interface.
- First stable release.
- Renamed to Plogins Reel for WooCommerce for a more distinctive plugin name.
- Redesigned settings screen: card layout, toggle switches, inline help tooltips and a live zoom-strength control.
- Polished storefront styling: themeable CSS custom properties, fluid sizing, dark-mode support and reduced-motion guards.
- Accessibility: named lightbox dialog, role=tooltip help, visible focus styles and full keyboard operability.
- Robustness: graceful empty/placeholder states, a no-layout-shift video skeleton and hardened event handling.
- Add
[reel_video]shortcode to place the featured video anywhere. - Add lightbox caption (from image alt text) and an option to skip hover zoom on touch devices.
- Add settings for the open-in-lightbox label, a default video heading and an optional intro paragraph.
- Add a "Settings" link on the plugins list and an uninstall routine that removes plugin options.
- Bundle a translation template (languages/reel.pot) and a Polish translation.
- Initial release: gallery hover zoom, accessible lightbox and featured product video.