The Video Popup Widget allows you to display a button or link that, when clicked, opens a video in a popup. It’s perfect for embedding YouTube, Vimeo, Dailymotion, VideoPress, or self-hosted videos on your website.
Activate the widget
This widget is part of the aThemes Addons for Elementor plugin. To activate it, go to your admin area, visit the aThemes Addons dashboard, search for the widget, and click on the switch to activate it. It will now be available in your Elementor interface.
Widget options
Trigger section
- Trigger: Choose between “Text”, “Icon”, or “Text & Icon” to define how the popup trigger will appear.
- Text: Enter the text for the trigger (e.g., “Play Video”). This option is available if “Text” or “Text & Icon” is selected.
- Select Icon: Choose an icon for the trigger. This option is available if “Icon” or “Text & Icon” is selected.
- Separate lines?: Toggle to display the text and icon on separate lines. Available when “Text & Icon” is selected.
- Trigger Style: Choose between “Button” and “Link” styles for the trigger.
- Glow: Toggle to enable a glow effect for the button-style trigger.
- Alignment: Align the trigger to the left, center, or right.
Video section
- Source: Select the video source (YouTube, Vimeo, Dailymotion, VideoPress, or Self Hosted).
- Link: Enter the URL of the video. The input field changes based on the selected source.
- Start Time: Specify the start time in seconds.
- End Time: Specify the end time in seconds (available for YouTube and Self Hosted videos).
- Autoplay: Toggle to enable autoplay when the video pops up.
- Play On Mobile: Toggle to enable autoplay on mobile devices (requires Autoplay to be enabled).
- Mute: Toggle to mute the video.
- Loop: Toggle to loop the video (not available for Dailymotion).
- Player Controls: Toggle to show or hide video player controls (not available for Vimeo).
- Video Info: Toggle to show or hide video information (available for Dailymotion).
- Modest Branding: Toggle to use modest branding for YouTube videos (requires Player Controls to be enabled).
- Privacy Mode: Toggle to enable privacy mode for YouTube and Vimeo videos.
- Lazy Load: Toggle to enable lazy loading for videos.
- Suggested Videos: Choose between “Current Video Channel” and “Any Video” for YouTube recommended videos.
- Intro Title: Toggle to show or hide the intro title for Vimeo videos.
- Intro Portrait: Toggle to show or hide the intro portrait for Vimeo videos.
- Intro Byline: Toggle to show or hide the intro byline for Vimeo videos.
- Controls Color: Set the color for Vimeo and Dailymotion controls.
- Download Button: Toggle to show or hide the download button for self-hosted videos.
- Preload: Select the preload option for self-hosted videos (Metadata, Auto, or None).
- Poster: Upload a poster image for self-hosted videos.
Style tab
Customize the appearance of your video popup under this tab. You have a variety of options to ensure the widget matches your website’s design and branding perfectly.
Trigger Style
- Icon Size: Adjust the size of the icon when the trigger type includes an icon.
- Glow Color: Set the color of the glow effect for the button style trigger.
- Button Background Color: Customize the background color of the button trigger.
- Button Text Color: Set the color of the text within the button trigger.
- Button Border: Configure the border settings, including color, width, and radius for the button trigger.
- Button Padding: Adjust the padding inside the button to control its size and spacing.
- Button Hover Effects: Customize hover effects for the button trigger, including hover color, background, and border.
Video Style
- Aspect Ratio: Select the aspect ratio for the video (e.g., 16:9, 4:3, 1:1) to ensure it fits well within your design layout.
- CSS Filters: Apply CSS filters to the video to adjust brightness, contrast, saturation, and more for better visual effects.
- Background Color: Set the background color for the lightbox popup.
- UI Color: Customize the color of the user interface elements like the close button.
- UI Hover Color: Set the hover color for the user interface elements to provide visual feedback on interaction.
- Entrance Animation: Choose an animation effect for how the lightbox content appears on the screen. This can help draw attention to the video when it pops up.
These style options ensure that your video popup looks professional and integrates seamlessly with your site’s overall design.
Usage tips
- Use high-quality video sources for better viewing experiences.
- Enable lazy loading to improve page load times.
- Use the privacy mode for YouTube and Vimeo to enhance user privacy.
Conclusion
The Video Popup Widget is a versatile tool for embedding videos in a popup on your website. With extensive customization options, you can tailor the appearance and functionality to match your needs and provide an engaging user experience.