Kinetic Video Modal for clean, focused video delivery.

Show product demos, tutorials, testimonials, reels, hero videos, and course previews without loading third-party players on first paint. Open videos in a polished modal or keep playback inline inside the layout.

Video Modal Preview
Modal or inline playback
YouTube · Vimeo · Local
Custom cover + focus-safe modal
Product demo

Open a focused video experience without loading the player up front.

Use a custom cover image, choose a clean aspect ratio, and let visitors open a modal overlay only when they are ready to watch.

Inline playback Keep the video inside the page flow.

Great for product walkthroughs, tutorial sections, feature cards, and media areas that should stay embedded in the layout.

Playback controls Choose the presentation style that fits the page.

Fine-tune the button style, overlay opacity, entrance animation, close behavior, and local video loading strategy for a polished result.

On the live page, replace these mockups with two real Kinetic Video Modal blocks: one
using modal playback for focused viewing and one using inline
playback for embedded page sections.

Best for cards, product sections, media, course lesson, and layouts where the video should stay embedded inside the content flow.

Watch Trailer

Best for hero demos, product explainers, course trailers, testimonials, and any video that deserves full attention without leaving the page flow.

Play Demo

Kinetic Video Modal helps you present video in a way that feels intentional, performance-aware, and easier to style than a default embed.

  • Delay heavy player loading until the visitor actually clicks to watch.
  • Choose the right viewing mode with modal playback for focus or inline playback for embedded sections.
  • Control the presentation with custom covers, aspect ratios, button styles, overlay opacity, and modal entrance behavior.
  • Upgrade with PRO for interaction polish, expanded styling, and better visual flexibility for premium landing pages.

Use it when the video is important to the page, but the page still needs to stay fast, elegant, and easy to scan before the visitor hits play.

  • Product demos and SaaS walkthroughs
  • Course previews and lesson intros
  • Client testimonials and case study videos
  • Portfolio reels and creative showcases
  • Hero videos on landing pages
  • Help center and tutorial content

Use Video Modal where a preview should invite the click.

The block works best when a clean visual cover, a clear play action, and a focused
playback experience can improve conversions or comprehension.

  • Use custom covers for brand consistency and cleaner cropping.
  • Use optimized cover images to keep the preview light.
  • Choose metadata preload for local video when speed matters.

Present feature walkthroughs without placing a full player above the fold.

Open trailer lessons or instructor intros inside a focused dialog.

Use branded covers to make customer story videos feel more intentional.

Show creative work in a cleaner viewing experience than a default embed.

Keep instructional content inline when it belongs inside the reading flow.

Use polished covers and modal playback for high-impact launch videos.

Embed inline video inside product or service sections without breaking the layout.

Use self-hosted MP4, WebM, or OGG files with preload control and start time support.

Start with a reliable video container. Upgrade for richer presentation control.

KineticHub Free gives you the core playback workflow for YouTube, Vimeo, and self-hosted video. KineticHub PRO adds more interaction polish and presentation flexibility for premium pages.

FeatureKineticHub FreeKineticHub PRO
Supported video sourcesYouTube, Vimeo, local filesIncluded
Playback modesModal and inlineIncluded
Custom cover imageIncludedIncluded
Automatic YouTube thumbnail detectionIncludedIncluded
Aspect ratios16:9, 4:3, 21:9, 1:1Included
Play button stylesSolid, glass, outlineIncluded
Button size, button color, icon colorIncludedIncluded
Backdrop style and modal entranceDefault zoom entranceIncluded
Close behavior and accessibility labelsIncludedIncluded
Autoplay, mute, loop, start timeNot includedUnlocked
Magnetic pull and pulse interactionNot includedUnlocked
Enhanced hover treatment and visual polishNot includedUnlocked

Use this FAQ section for SEO, sales clarity, and fewer pre-sale/support questions.

What is Kinetic Video Modal?

Kinetic Video Modal is a Gutenberg block for presenting YouTube, Vimeo, and self-hosted video through a styled preview area with either modal playback or inline playback.

What video sources are supported?

The block supports YouTube, YouTube privacy-enhanced embeds, Vimeo, and direct self-hosted video file URLs such as MP4, WebM, and OGG.

What is the difference between modal and inline playback?

Modal playback opens the video in an overlay for a more focused viewing experience. Inline playback replaces the preview container with the active player directly inside the page content.

Can I use a custom cover image?

Yes. You can upload a custom cover image, or for YouTube videos you can use automatic thumbnail detection with fallback handling.

Why is it better than dropping a raw embed?

It gives you a branded cover image, lighter initial loading, better control over playback context, aspect ratio options, styled play buttons, and a more accessible modal experience.