Overview
The Advanced Video module adds a fully featured, customizable video player to your Divi page. It supports self-hosted video files (MP4, WebM, OGV) and embedded URLs from YouTube, Vimeo, and other platforms. Powerful extras include a custom overlay with a play button, a fullscreen lightbox mode, and a sticky mini-player that stays on screen as visitors scroll. An optional title and description can be displayed above the video for additional context.
Content Settings
Title & Description
Title (Text Field)
Enter a title for the video. Displayed above the video player.
- Default: Your Video Title
Description (Rich Text)
Enter a description for the video. Supports basic rich text formatting.
- Default: Your Video Description
Video Source
Video Type (Dropdown)
Choose Self-Hosted to upload your own files, or Embed URL to use YouTube, Vimeo, or other streaming platforms.
- Available options: Self-Hosted, Embed URL
- Default: Self-Hosted
MP4 File (File Upload)
Upload or select an MP4 video file from the WordPress Media Library.
- Only appears when Video Type is set to Self-Hosted
WebM File (File Upload)
Upload a WebM version of the video for broader browser support.
- Only appears when Video Type is set to Self-Hosted
OGV File (File Upload)
Upload an OGV/OGG video as a legacy fallback for older browsers.
- Only appears when Video Type is set to Self-Hosted
Fallback Video (File Upload)
Generic fallback video file for browsers that do not support the primary formats.
- Only appears when Video Type is set to Self-Hosted
Video URL (Text Field)
Paste a video URL from YouTube, Vimeo, or other supported platforms. Standard watch URLs are converted to embeds automatically.
- Only appears when Video Type is set to Embed URL
Poster Image (File Upload)
Thumbnail image shown before the visitor presses Play (applies to self-hosted video).
Placeholder Image (File Upload)
Preview image shown in the Visual Builder editor when no video source has been set yet.
Playback
Autoplay (Toggle)
Start playing automatically when the page loads. Note: most browsers require the video to be muted for autoplay to work.
- Default: Off
Mute (Toggle)
Mute the video audio on load.
- Default: Off
Loop (Toggle)
Automatically restart the video when it reaches the end.
- Default: Off
Show Controls (Toggle)
Display the native browser video controls (play, pause, volume, fullscreen, etc.).
- Default: On
Preload (Dropdown)
Controls how much video data is fetched before the visitor presses Play — balances page speed against playback readiness.
- Available options: Metadata, Auto, None
- Default: Metadata
Lazy Load (Toggle)
Defer loading the video until it is near the visitor's viewport, improving initial page load performance.
- Default: Off
Start Time (sec) (Text Field)
Begin playback at this timestamp in seconds. Leave empty or set to 0 to start from the beginning.
End Time (sec) (Text Field)
Stop playback at this timestamp in seconds. Leave empty or set to 0 to play to the very end.
ARIA Label (Text Field)
Accessible label for the video region, read by screen readers to identify the player.
- Default: Video Player
Overlay & Play Icon
Enable Overlay (Toggle)
Show a styled overlay with a play button on top of the video thumbnail.
- Default: Off
Overlay Image (File Upload)
Optional background image for the overlay layer (replaces the video thumbnail behind the play button).
- Only appears when Enable Overlay is turned on
Play Icon Style (Dropdown)
Choose the visual style of the play button icon.
- Available options: Circle, Square, Custom Icon
- Default: Circle
Custom Icon (File Upload)
Upload a custom image to use as the play button icon.
- Only appears when Play Icon Style is set to Custom Icon
Lightbox
Enable Lightbox (Toggle)
Open the video in a fullscreen lightbox overlay when clicked.
- Default: Off
Trigger Type (Dropdown)
Choose what the visitor clicks to open the lightbox — the overlay play button only, or anywhere on the module.
- Available options: Overlay Click, Whole Module
- Default: Overlay Click
- Only appears when Enable Lightbox is turned on
Show Close Button (Toggle)
Display a close (×) button in the lightbox so visitors can dismiss it.
- Default: On
- Only appears when Enable Lightbox is turned on
Sticky Player
Enable Sticky (Toggle)
Show a compact mini-player fixed to a corner of the screen when the main video module scrolls out of view.
- Default: Off
Sticky Position (Dropdown)
Choose which corner of the screen the mini sticky player appears in.
- Available options: Bottom-Right, Bottom-Left, Top-Right, Top-Left
- Default: Bottom-Right
- Only appears when Enable Sticky is turned on
Show Close Button (Toggle)
Display a close button on the sticky player so visitors can dismiss it.
- Default: On
- Only appears when Enable Sticky is turned on
Pause on Minimize (Toggle)
Automatically pause the video when the sticky player is minimized or dismissed.
- Default: Off
- Only appears when Enable Sticky is turned on
Link
Standard Divi link options — add a URL to make the module clickable.
Background
Standard Divi background options including solid color, gradient, image, and video backgrounds.
Design Settings
Title
Standard Divi font options for the video title — control font family, size, weight, style, color, line height, and letter spacing.
Description
Standard Divi font options for the video description — control font family, size, weight, style, color, line height, and letter spacing.
Video Wrapper
Style the video player area itself: Spacing (margin and padding around the video), Border (style, radius, color), and Box Shadow.
Play Button
Icon Color (Color Picker)
Color of the play icon inside the play button.
- Default: #ffffff
Background Color (Color Picker)
Background color of the play button circle or square.
- Default: Semi-transparent black
Button Size (Slider)
Width and height of the play button.
- Range: 24 to 120 px
- Default: 64 px
Play Button Style
Additional play button styling: Spacing (margin/padding), Border (style, radius, color), and Box Shadow.
Overlay
Style the overlay layer: Spacing, Border, and Box Shadow.
Sticky Wrapper
Style the sticky mini-player container: Spacing, Border, and Box Shadow.
Built-in Style Options
Standard Divi module-level design options: Sizing (width and height), Spacing (margin and padding), Border, Box Shadow, Filters (opacity, blur, brightness, etc.), Transform (rotate, scale, translate), and Animation (entrance effects).
Advanced Settings
- CSS ID & Classes — Add a custom CSS ID or classes to the module for targeted styling.
- Custom CSS — Write custom CSS targeting specific parts of the player: title, description, video wrapper, play button, overlay, and sticky wrapper.
- Visibility — Show or hide this module on desktop, tablet, or phone.
- Scroll Effects — Add parallax or scroll-triggered animation effects.
- Position — Control the module's positioning (relative, absolute, fixed).
- Transition — Customize hover transition duration and style.
- Conditions — Set conditions for when this module should display.
Tips & Best Practices
- For YouTube or Vimeo videos, use the Embed URL type and set a Poster Image — this displays a clean branded thumbnail in the Visual Builder and on the frontend before the visitor clicks play.
- Combine Enable Overlay + Enable Lightbox to create a polished 'click to watch' experience: the visitor sees your poster image with a play button, clicks it, and the video opens full-screen.
- Use the Sticky Player feature for long-form content like tutorials or webinars — visitors can continue watching in the corner even as they scroll down to read comments or related content.