説明
Peekaboo Video Reveal turns a static poster image into an interactive, press-and-hold video reveal.
It’s built with Three.js + WebGL shaders and is designed to feel smooth on both desktop and mobile.
Use it on landing pages, campaigns, and product pages to create a high-end “peekaboo” interaction:
– Press and hold to progressively reveal the video.
– Release to smoothly return to the poster.
Video Tutorial
Features
- Responsive layout (works across screen sizes)
- Desktop + mobile optimized (mouse + touch)
- Multiple display types (responsive sizing and scaling to the parent)
- Hold-to-reveal interaction (progress in/out speeds)
- Shader-driven transitions (swirl + optional flowmap/liquid feel)
- Optional parallax for subtle depth
- Customizable overlays/text (center text, hold-to-play HTML)
- Viewer styling options (including background color)
Getting Started
- In WordPress admin, open the Peekaboo Video Reveal Items Manager.
- Create an item and configure the poster/video sources and settings.
- Copy the generated shortcode and paste it into any post/page.
Shortcode
Use the item name as the shortcode id:
[fwdpvr id=”Your Item Name”]
WooCommerce
Peekaboo Video Reveal can be used in WooCommerce product pages.
Typical workflow:
1. Add the shortcode to the product description.
2. The plugin can replace the default product gallery with the viewer.
Documentation & Demo
- Demo page: https://fwdapps.net/p/pvr/
- WordPress documentation: https://fwdapps.net/p/pvr/wordpress-documentation.html
- JavaScript documentation: https://fwdapps.net/p/pvr/javascript-documentation.html
- Support: https://fwdapps.net/contact
Development
This plugin’s full source code is publicly available for transparency and verification.
Developed and maintained by FutureWebDesign.
- Source code & build tools — includes original uncompiled files and Vite build configuration.
- Distributed plugin uses a compiled build generated by Vite for optimal performance.
スクリーンショット
Items Manager (create and manage items) 
General settings (display type, sizing, overlay text) 
Post processing (swirl + flowmap controls) 
インストール
- Upload the plugin folder to
/wp-content/plugins/. - Activate the plugin from the WordPress Plugins screen.
- Create an item in the admin and embed it via shortcode.
FAQ
-
Does it work with Gutenberg?
-
Yes. Paste the shortcode into a Shortcode block, Paragraph block, or the Classic block.
-
Is it mobile-friendly?
-
Yes. It’s designed for touch and responsive layouts.
-
Can I use multiple instances on the same page?
-
Yes on regular pages. For WooCommerce product pages, the plugin limits to a single instance to avoid conflicts with the gallery replacement.
-
Where do I find the available settings?
-
Open the Items Manager in the WordPress admin area and edit an item. General settings and Post processing settings are available there.
評価
このプラグインにはレビューがありません。
