Today, we are going to share an easy way to display YouTube or Vimeo videos in lightbox in WordPress via shortcode. We’ll use WP Video Lightbox plugin for this. So, download the plugin the from here and install.
- Video Lightboxyoutube And Vimeo Videos In Lightbox Plugin
- Video Lightboxyoutube And Vimeo Videos In Lightbox App
After activation, go to Settings -> Video Lightbox.
The best WordPress Video Lightbox Plugin! WP Video Popup lets you add a responsive YouTube or Vimeo video lightbox to any page, post or custom post type of your website. Add beautiful, minimalistic video lightbox popups to your WordPress website with just a few clicks & without sacrificing performance. Video LightBox for MAC earns Apple 'Staff Pick' (August 19, 2009) Video LightBox MAC version beta (August 17, 2009). MAC version of Video LightBox is added. Download it here. Video LightBox v1.2 (August 14, 2009). Video LightBox supports Google Video, Metacafe, Vimeo, MySpace play video in lightbox effect videos now!
In general option, check “Enable jQuery” if you haven’t added jQuery library yet. Otherwise, uncheck the option.
Now click on “prettyPhoto” tab (as the plugin uses prettyPhoto library). There you’ll see many lightbox options. Leave the options as it is, or you can make some changes in configuration. Following are the shortcodes for embedding videos of different types (YouTube, Vimeo). You can also embed flash videos and iframes.
How to embed YouTube in lightbox
For embedding YouTube videos, you will need the specific video id.
[code type=”php”]
[video_lightbox_youtube video_id=”xxxxxxxx” width=”600″ height=”400″ anchor=”open YouTube video”]
[/code]
xxxxxxxx = YouTube’s video ID
width = Width of the video
height = Height of the video
anchor = Anchor text. Internal links. Text could be image, so for image you’ll have to attach an image url (http://www.example.com/1.jpg).
How to embed Vimeo in lightbox
Format for embedding vimeo’s video is:
[code type=”php”]
[video_lightbox_vimeo5 video_id=”13562192″ width=”640″ height=”480″ anchor=”click here to open vimeo video”]
[/code]
Now you can embed these shortcodes in any post or page. Remember to put a valid YouTube or Vimeo’s valid video ID.
Description
The best WordPress Video Lightbox Plugin!
WP Video Popup lets you add a responsive YouTube or Vimeo video lightbox to any page, post or custom post type of your website.
Add beautiful, minimalistic video lightbox popups to your WordPress website with just a few clicks & without sacrificing performance.
Use the shortcode
in your post, page, custom post type or template file to add a responsive YouTube or Vimeo video lightbox to your WordPress website.
To open the lightbox, simply add the CSS-class
to the element you wish to open/trigger the lightbox.
GDPR Compliance
WP Video Popup is 100% GDPR compliant. No connection to YouTube or Vimeo is established before the trigger element has been clicked.
Video Lightboxyoutube And Vimeo Videos In Lightbox Plugin
Page Speed & Performance
Embedding YouTube or Vimeo videos can slow down your website. With WP Video Lightbox the video is only being loaded by the click on the trigger element for the maximum performance & fast loading speeds.
Fully Responsive
The WordPress video lightbox is fully responsive and adjusts to the device width & height the video is viewed on.
Usage
Example Shortcode to display a YouTube video lightbox:
Example Shortcode to display a Vimeo video lightbox: Houston small business guideideas and info for entrepreneurs association.
CSS class that needs to be added to the element you want to open/trigger the video lightbox:
Trigger Element Example (Link):
Shortcode Attributes
There are attributes available to add parameters to the embed-URL that’s dynamically generated from the video link provided in the shortcode.
Mute video:
Hide related YouTube videos:
Since September 2018, hiding related videos is no longer possible. Instead videos from your channel will be shown.
Start video at a specific time (value in seconds):
Portrait mode (Vimeo only):
Example Shortcode with shortcode attributes:
Advanced
In addition to the shortcode attributes, there is a filter available that allows you to add more parameters to the embed-URL. By default, only the autoplay attribute is added to the embed-URL.
In the example below, we use the filter to remove the YouTube branding from the video by adding the modestbranding parameter:
WP Video Popup PRO
For multiple popups on a single page, video galleries, autoplay on page load, self-hosted videos & more check out WP Video Popup PRO!
PRO Features:
- Multiple Popups on a single Page/Post/CPT
- Self-Hosted Videos (New!)
- Video Galleries (New!)
- Autoplay on Page-Load
- Adjustable Popup Size
- Overlay Background-Color Setting
NEW! – Create video lightbox galleries with WP Video Popup PRO:
Get WP Video Popup PRO today!
What’s next?
If you like WP Video Popup make sure to check out our other products:
- Page Builder Framework – A fast & minimalistic WordPress theme designed for the new WordPress era.
- Ultimate Dashboard – The #1 WordPress plugin to customize your WordPress dashboard and admin area.
- WP Swift Control – The plugin to make your clients enjoy WordPress. It replaces the default admin bar to provide the best possible user experience when editing & navigating a website.
Installation
- Download the responsive-youtube-vimeo-popup.zip file to your computer.
- Unzip the file.
- Upload the
responsive-youtube-vimeo-popupfolder to your/wp-content/plugins/directory. - Activate the plugin through the Plugins menu in WordPress.
FAQ
How do i use this plugin?
WP Video Popup doesn’t create an admin settings page. To trigger and display the lightbox popup, please follow the steps under Description.
The video doesn’t play automatically
We add the autoplay attribute to the embed-URL by default. That being said, the video should play automatically after the trigger element has been clicked. Some browsers have changed their autoplay policy and videos only start playing if they’re muted.
To mute the video, add the mute='1' attribute to the shortcode like this:
Reviews
Video Lightboxyoutube And Vimeo Videos In Lightbox App