Tino631 Floating Video

Description

Tino631 Floating Video floats a playing video into a corner when its original position scrolls above the viewport. Scroll back and it returns to the page. The original video element stays in place in the document: Tino631 Floating Video does not clone it, reparent it, or change its source when docking.

  • HTML5 videos with controls, including WordPress Video blocks and standard MediaElement players.
  • Optional YouTube, YouTube privacy-enhanced, and Vimeo integrations.
  • Four screen corners, adjustable width and spacing, and opt-in mobile support.
  • A single floating player at a time, with the most recently started eligible video taking priority.
  • Keyboard-accessible Back to video and Close controls. Escape closes when focus is inside the floating player or its controls.
  • Closing pauses playback and disables floating for that video for the rest of the page visit.
  • No autoplay, analytics, advertising, accounts, or paid service required by Tino631 Floating Video.
  • Dynamic HTML5 videos and supported API-ready embeds can be discovered after page load.

HTML5 support is enabled on activation. Mobile, YouTube and Vimeo support are off until enabled in Settings > Tino631 Floating Video.

External services

With the YouTube integration enabled, pages containing a supported, API-ready YouTube iframe load the official YouTube IFrame Player API from https://www.youtube.com/iframe_api. This allows the plugin to observe playback and pause a dismissed player. The API can load additional resources from YouTube. Visitors’ browsers connect to Google/YouTube, which receives standard request data such as IP addresses and may use cookies according to its policies. WordPress content and block-widget YouTube embed URLs gain enablejsapi and the site’s origin before being sent to the browser. The privacy-enhanced youtube-nocookie.com host is preserved.

  • YouTube terms: https://www.youtube.com/t/terms
  • YouTube API terms: https://developers.google.com/youtube/terms/api-services-terms-of-service
  • Google privacy policy: https://policies.google.com/privacy

With the Vimeo integration enabled, pages containing a supported Vimeo iframe load the official Vimeo Player SDK from https://player.vimeo.com/api/player.js. This allows the plugin to observe playback and pause a dismissed player. Visitors’ browsers connect to Vimeo, which receives standard request data such as IP addresses and may use cookies according to its policies.

  • Vimeo terms: https://vimeo.com/terms
  • Vimeo privacy policy: https://vimeo.com/privacy

Tino631 Floating Video makes no server-side requests to these services and adds no tracking of its own. Existing embeds may already contact their providers independently of Tino631 Floating Video. Integrate embeds with your site’s consent system; Tino631 Floating Video leaves data-src-only consent placeholders untouched and does not provide a consent banner.

Installation

  1. Upload the tino631-floating-video.zip file using Plugins > Add New Plugin > Upload Plugin, or copy the tino631-floating-video folder into wp-content/plugins.
  2. Activate Tino631 Floating Video.
  3. Visit Settings > Tino631 Floating Video. Choose a corner and width. Enable mobile or external player integrations if wanted.
  4. Start a video on your site, then scroll until the original player is completely above the screen.

FAQ

Does it work with every video player?

No. It supports HTML5 videos with controls, standard WordPress MediaElement video containers, supported YouTube embed iframes with the JavaScript API enabled, and Vimeo video iframes. Other providers, advertising players, shadow-DOM players, and heavily customized player wrappers need separate compatibility work. Background videos without controls are excluded.

How do I exclude a video?

In the block editor’s Advanced panel, add tino631fv-ignore to Additional CSS class(es) on the video or containing block. Custom markup can use data-tino631fv=”off” on the video or an ancestor.

Why does a video stay inline?

It must be playing and completely above the viewport. Mobile support and external integrations must be enabled separately. Fullscreen or native picture-in-picture suspends floating. Layouts with transformed, filtered, or paint-containing ancestors stay inline because moving an iframe out of that layout can restart playback. Videos in custom overflow-scrolling containers are not supported.

Does it restart a YouTube or Vimeo video?

Docking changes the existing element’s CSS without moving its DOM node or changing its source. Provider behavior, browser restrictions, and other plugins can still affect playback. If an API is blocked, the embed remains inline.

What about custom YouTube embeds?

WordPress content and block-widget embeds are prepared automatically when integration is enabled. Custom or dynamically inserted YouTube iframes must already contain enablejsapi=1 and an appropriate origin parameter. Tino631 Floating Video never modifies the source of a live iframe to add API support.

What happens when I close or pause?

Pause returns the video to its original page position. Close also disables floating for that particular video until the next page load. Back to video scrolls to the original player and leaves playback running. No dismissal cookies are stored.

Can I use this on a network?

Each site has its own settings. Deleting the plugin removes its saved settings across the network. Deactivation preserves settings.

Reviews

There are no reviews for this plugin.

Contributors & Developers

“Tino631 Floating Video” is open source software. The following people have contributed to this plugin.

Contributors

Changelog

1.0.0

  • Initial release with HTML5 playback-aware docking, optional YouTube and Vimeo APIs, accessible controls, per-site settings, and responsive positioning.