WP Video Popup opens YouTube, Vimeo and Rumble videos in a responsive lightbox. Adding one takes two steps: place the shortcode, then choose what opens the popup - a button, an image or any other element on the page.
Don’t have the plugin yet? Download WP Video Popup for free from WordPress.org.
Step 1: Add the shortcode
Paste the shortcode into any post, page, custom post type or template file and replace the URL with your own video:
[wp-video-popup video="https://www.youtube.com/watch?v=YlUKcNNmywk"]
Tip: build your shortcode under Settings → WP Video Popup and copy it with one click.
YouTube video popup
[wp-video-popup video="https://www.youtube.com/watch?v=YlUKcNNmywk"]
Want YouTube’s privacy-enhanced mode? Use a youtube-nocookie.com link instead.
Vimeo video popup
[wp-video-popup video="https://vimeo.com/136696258"]
Rumble video popup
Use the Rumble video page or its embed link:
[wp-video-popup video="https://rumble.com/embed/v4j2rri/?pub=4"]
Step 2: Choose what opens the popup
Open the video popup on button click
Add the text attribute and the shortcode outputs a button (styled by your theme) that opens the popup:
[wp-video-popup video="https://www.youtube.com/watch?v=YlUKcNNmywk" text="Watch video"]
Open the video popup by clicking an image
Wrap an image (or any other content) in the shortcode to turn it into a clickable video thumbnail:
[wp-video-popup video="https://www.youtube.com/watch?v=YlUKcNNmywk"]<img src="thumbnail.jpg" alt="Watch video">[/wp-video-popup]
Open the video popup from any element
Add the CSS class wp-video-popup to any button, link or image on the page:
<a href="#" class="wp-video-popup">Watch video</a>
Live demo: Play video
Here’s where to find the CSS class field in your page builder:
- Block editor (Gutenberg): Advanced → Additional CSS class(es)
- Elementor: Advanced → CSS Classes
- Divi: Advanced → CSS ID & Classes
- Bricks: Style → CSS → CSS classes
Step-by-step guides: Elementor, block editor (Gutenberg), Divi and Bricks.
The free version supports one video popup per page. To add more, see multiple video popups (PRO).
Shortcode attributes
Customize the popup with these attributes:
Button text
Outputs a button that opens the popup.
text="Watch video"
Mute video
mute="1"
Start at a specific time
Value in seconds.
start="24"
Portrait mode
For vertical videos.
portrait="1"
Hide related videos (YouTube)
hide-related="1"
Since September 2018, YouTube no longer allows hiding related videos completely. Videos from your own channel are shown instead.
Example with attributes
[wp-video-popup video="https://www.youtube.com/watch?v=YlUKcNNmywk" mute="1" start="24" text="Watch video"]
Need to add other parameters to the embed URL? Use the wp_video_popup filter.
Related guides
- Multiple video popups, galleries & autoplay (PRO)
- Video popup doesn’t autoplay? Here’s why
- Popup plays the wrong video (Californication)
- Install WP Video Popup PRO & activate your license
- How to add a video popup in Elementor
- How to add a video popup in the block editor (Gutenberg)
- How to add a video popup in Divi
- How to add a video popup in Bricks
- Autoplay a video popup on page load (PRO)