FWD Video Player

Description

FWD Video Player is a powerful and unique responsive video player for WordPress and WooCommerce that uses playlists to play local, self-hosted, or streaming video and audio files, including YouTube, Vimeo, Vimeo Pro, HLS, MPEG-DASH, 360-degree video/VR, Google AdSense, VAST, and VMAP.

It is designed for publishers, course creators, media websites, membership platforms, product pages, and any project that needs a professional HTML5 player with deep customization, monetization, analytics, and content-protection tools.

Homepage | Demos | API | Support

Links

• Product page
• Live demos
• API examples
• Buy WordPress plugin
• Buy JavaScript version
• Contact and support

Main Features

Core Player Features

• Responsive layout, fully adaptable to any screen size and device.
• Desktop- and mobile-optimized playback.
• Multiple instances on the same page, with instance-aware playback coordination. Example: multiple instances.
• Multiple display types including responsive, fixed, sticky, fullscreen, lightbox, and popup modes.
• Optional deeplinking with unique shareable URLs for the current playlist and current video.
• Lazy scrolling / loading so the player initializes only when visible in the viewport.
• Resume / remember playback position when the browser is closed and reopened.
• URL timestamp support to start and/or stop playback from the URL. Example: timestamp demo.
• Optional go fullscreen on play. Example: go fullscreen on play.
• Fill entire video screen and poster screen for full-width / gap-free presentation.
• Double click and double tap gestures for fullscreen toggle and 10-second seek.
• Keyboard support: fullscreen, play/pause, mute, volume, and seek shortcuts.
• Custom right-click context menu with copy video URL, copy URL at current time, and fullscreen actions.
• Powerful API with methods and events for play, pause, stop, scrub, volume, and more. Example: API demo.

Supported Media Sources And Formats

• Self-hosted HTML5 video and audio.
• Local or external .mp4 and .mp3 playback.
• YouTube single videos, playlists, and channels.
• Vimeo and Vimeo Pro videos, albums, playlists, and showcases.
• Apple HLS / .m3u8 live streaming with adaptive bitrate support.
• MPEG DASH / .mpd live streaming.
• Google Drive media. Example: Google Drive demo.
• Amazon S3, Dropbox, and other cloud or external sources.
• One-format video and audio workflow where a single .mp4 or .mp3 source can be used across browsers.
• Various video and audio formats in mixed playlists.

Streaming, Quality, And Audio Features

• Multiple video quality levels such as 720p, 1080p, 2160p, and more. Example: multiple video quality.
• Playback rate / speed selector. Example: playback rate demo.
• HLS multiple quality levels.
• HLS multiple audio tracks. Example: HLS audio tracks.
• Audio tracks support for .mp4 video where browser support is available.
• Real-time audio spectrum visualizer for .mp3 playback. Example: spectrum visualizer.

360 And VR Features

• 360 degree panoramic video support on desktop and mobile. Example: 360 video demo.
• Panoramic 360 VR and stereoscopic video support using WebXR.
• Cardboard mode and immersive VR playback support. Example: VR demo.

Playlist Features

• Support for unlimited playlists and unlimited videos per playlist.
• Playlist creation through HTML markup / database, XML, video folder, audio folder, YouTube playlist or channel, Vimeo album or showcase, and mixed playlists.
• HTML playlists: HTML markup playlist.
• XML playlists: XML playlist.
• Folder playlists: audio folder playlist.
• YouTube playlists: YouTube playlist.
• Vimeo playlists: Vimeo playlist.
• Playlists can be created manually or generated from a database.
• Two main playlist selection modes: dropdown selector or fullscreen thumbnail window.
• Playlist live search for both main playlists and current playlist items.
• Playlists window auto open. Example: open playlists demo.
• Playlist position on the right or bottom. Examples: right playlist and bottom playlist.
• Playlist without thumbnails. Example: playlist without thumbnails.
• Playlist with only thumbnails. Example: playlist only thumbnails.
• Customizable playlist width, thumbnail size, and text styling. Example: large playlist.
• Scroll playlist on mouse move. Example: scroll on mouse move.

Skins, Themes, And UI Customization

• Vector or image-based skins.
• Graphics (.png) skins and vector font skins.
• 5 graphics skins and 1 vector skin included, with dark and white variations.
• HEX / CSS skin color support so UI elements can be recolored from the admin.
• Customizable skin and theme color system.
• Advanced control bar settings.
• Optional buttons and UI modules: play, pause, fullscreen, playlist, rewind, next/previous, shuffle, loop, download, share, embed, volume controls, and more.
• Video poster support.
• Watermark logo with custom position, optional visibility rules, and link on click.
• Video info window for per-video info content. Example: info window demo.
• Embed and share window for the current video. Example: embed and share demo.

Preview, Subtitle, And Accessibility Features

• Multiple subtitles per video.
• Subtitle formats: .txt, .srt, and .vtt.
• Subtitle selector for switching subtitles during playback. Example: multiple subtitles.
• Thumbnails .vtt preview over the progress bar. Example: .vtt thumbnail preview.
• Live auto-generated thumbnails preview from video. Example: live thumbnails preview.
• Video tutorial for live thumbnails: watch tutorial.
• Annotations with full content control, HTML/CSS formatting, interactive links, and JavaScript callbacks. Example: annotations demo.

Security, Restriction, And Content Protection

• Encrypt video source / path to help prevent exposing the source URL in page source.
• Password protected videos. Example: private videos demo.
• Play only if logged in. Example: login required demo.
• Digital fingerprint stamp for tracing recorded content usage. Tutorial: digital fingerprint tutorial.

Advertising And Monetization

• Pre-roll, mid-roll, and post-roll advertising.
• Video, audio, YouTube, Vimeo, Vimeo Pro, iframe, HLS, DASH, and image ads.
• Popup commercial ads with configurable show/hide times. Example: popup ads demo.
• Popup advertisement window on pause using iframe content. Example: overlay advertisement window.
• Non-linear Google AdSense support.
• DFP / Google DoubleClick IMA tag support. Example: AdSense / IMA demo.
• VAST and VMAP support with monetization workflows. Example: VAST / VMAP demo.
• IMA SDK for HTML5 and Google AdSense DoubleClick integration.
• VPAID support.

Playback Control And User Experience

• A to B video loop / AB loop. Example: A to B loop demo.
• Autoplay with mute to comply with browser autoplay policies. Example: autoplay demo.
• Loop and shuffle options.
• Download video button support.
• Start at random video option.
• Start / stop playback at specified time.
• Start volume value setting.
• Click video to play / pause.
• Advanced video settings and advanced button settings.

Analytics, Integration, And WordPress Features

• Google Analytics integration. Tutorial: Google Analytics tutorial.
• WooCommerce support for product pages.
• WordPress admin with modular configuration and shortcode generator.
• Custom post types integration.
• Gutenberg and classic editor friendly shortcode workflow.
• Shortcode generator metabox inside WordPress.
• Detailed documentation and video tutorials. Example: WordPress tutorial.

Support And Ongoing Development

• Constant development and updates.
• Direct support from the UVP developer.
• Trusted by 25,000+ clients.
• Quality checked and extensively used in production environments.

Supported Use Cases

• Video courses and training portals
• Membership and paid content websites
• Product demo and marketing pages
• Audio playlists and podcast pages
• Streaming media websites
• Protected client dashboards
• WooCommerce product media galleries
• 360 / VR immersive showcases

Shortcode

Basic example:

[fwd-video-player preset_id= »1″ playlist_id= »1″ start_at_playlist= »0″ start_at_video= »0″]

Shortcode attributes:
– preset_id: The preset configuration ID.
– playlist_id: The playlist ID to load.
– start_at_playlist: Optional playlist index to open first.
– start_at_video: Optional video index to start first.

External services

This plugin uses the following third-party/external services:

1. Google Analytics (Google Tag Manager script)

– What it is used for: optional playback analytics/events.
– When it is used: only if a Google Analytics Measurement ID is configured in the player preset.
– What data is sent: playback analytics event data (for example video URL, video name, played percentage, playback position, duration, fullscreen state, and download/ad events).
– Service provider: Google.
– Terms of service: https://policies.google.com/terms
– Privacy policy: https://policies.google.com/privacy

1. YouTube Data API v3

– What it is used for: load YouTube playlists/channels metadata into the player playlist.
– When it is used: when a YouTube playlist or channel source is configured.
– What data is sent: YouTube channel ID or playlist ID and the configured YouTube API key from plugin settings; request is made from the visitor browser.
– Service provider: Google (YouTube).
– Terms of service: https://www.youtube.com/t/terms
– Privacy policy: https://policies.google.com/privacy

1. YouTube IFrame Player API

– What it is used for: embedded playback and control of YouTube videos inside the player.
– When it is used: when the current source is a YouTube video.
– What data is sent: the visitor browser connects to YouTube to load the player API and video resources.
– Service provider: Google (YouTube).
– Terms of service: https://www.youtube.com/t/terms
– Privacy policy: https://policies.google.com/privacy

1. Vimeo API (server-side metadata requests)

– What it is used for: retrieving Vimeo playlist/channel/album video metadata for configured Vimeo sources.
– When it is used: when a Vimeo channel/album/user source is configured and the plugin requests that source data.
– Remote domains: https://api.vimeo.com (and Vimeo upload endpoints returned by Vimeo API when applicable).
– What data is sent: Vimeo endpoint path and query parameters such as channel/album/user identifiers, pagination/sort options, requested fields, and Vimeo API authentication credentials configured for the plugin.
– Service provider: Vimeo.
– Terms of service: https://vimeo.com/terms
– Privacy policy: https://vimeo.com/privacy

1. Vimeo Player API

– What it is used for: embedded playback and control of Vimeo videos inside the player.
– When it is used: when the current source is a Vimeo video.
– What data is sent: the visitor browser connects to Vimeo to load the player API and video resources.
– Service provider: Vimeo.
– Terms of service: https://vimeo.com/terms
– Privacy policy: https://vimeo.com/privacy

1. Google IMA SDK

– What it is used for: loading and rendering ad flows (IMA/DoubleClick/VAST/VMAP related playback).
– When it is used: when ad features that require IMA are enabled.
– What data is sent: ad request and playback context data from the visitor browser as required by the configured ad setup.
– Service provider: Google.
– Terms of service: https://policies.google.com/terms
– Privacy policy: https://policies.google.com/privacy

• Terms of service: https://policies.google.com/terms
• Privacy policy: https://policies.google.com/privacy

1. Social sharing endpoints (Facebook, X/Twitter, LinkedIn, Buffer, Reddit, Tumblr, Digg)

– What it is used for: opening social share windows from the player share UI.
– When it is used: when a visitor clicks a social share button in the player.
– What data is sent: the current page URL is passed to the selected sharing service.
– Service providers and legal links:
– Facebook terms: https://www.facebook.com/terms.php
– Facebook privacy: https://www.facebook.com/privacy/policy
– X terms: https://x.com/en/tos
– X privacy: https://x.com/en/privacy
– LinkedIn terms: https://www.linkedin.com/legal/user-agreement
– LinkedIn privacy: https://www.linkedin.com/legal/privacy-policy
– Buffer terms: https://buffer.com/legal#terms
– Buffer privacy: https://buffer.com/legal#privacy-policy
– Reddit terms: https://www.redditinc.com/policies/user-agreement
– Reddit privacy: https://www.reddit.com/policies/privacy-policy
– Tumblr terms: https://www.tumblr.com/policy/en/terms-of-service
– Tumblr privacy: https://www.tumblr.com/privacy/en
– Digg website: http://digg.com/

Video tutorials

• Main WordPress setup and usage: https://www.youtube.com/watch?v=WtlBO7KJGi4
• Installation (timestamped): https://www.youtube.com/watch?v=WtlBO7KJGi4?t=1
• WooCommerce setup: https://www.youtube.com/watch?v=SxAWCjNAKdQ
• 360 / VR workflow: https://www.youtube.com/watch?v=oL8oWo9UPGA
• Fingerprint stamp: https://www.youtube.com/watch?v=5ccWSz1Mr_0
• Google Drive media setup: https://www.youtube.com/watch?v=YK3YucN2PYc
• Google AdSense setup: https://www.youtube.com/watch?v=PXsfBh74ho4
• Thumbnails preview (.vtt): https://www.youtube.com/watch?v=hqTNCPE1zYE
• Live thumbnails preview: https://www.youtube.com/watch?v=XNhpC0dndAg
• YouTube API key: https://www.youtube.com/watch?v=whcjAjftBL0
• Google Analytics integration: https://www.youtube.com/watch?v=cs_j1pWSbEY
• Open in lightbox: https://www.youtube.com/watch?v=tEqE31YReX8

Development

This plugin’s source code for generated/compiled assets is publicly available for transparency and verification.
Developed and maintained by FutureWebDesign.

Source package (uncompiled files + build tooling):
– https://fwdapps.net/d/js/uvp.zip

Compiled files in this plugin and their source:
– js/FWDUVP.js -> generated from the player JavaScript source in the public source package above.
– content/java/threeControled.js -> generated from OrbitControls/360 controller source in the public source package above.
– content/java/three.js -> bundled Three.js vendor build (upstream: https://github.com/mrdoob/three.js/).

Build instructions (for the public source package):
1. Install Node.js LTS (18+ recommended).
2. Install dependencies: npm install
3. Build distributable files: npm run build
4. The build output contains the compiled assets used by this WordPress plugin distribution.

Note: distributed plugin files are optimized/compiled for production performance; original readable source and build configuration are provided in the public source package above.