Video Popup

Video Popup custom WPBakery Page Builder element, added by Loyde, renders a video preview which can be clicked to open the actual video in a popup.

Supported video streaming services

Currently, the element supports:

• YouTube
• Vimeo

This means that only links to videos from these platforms should be added to the Video Popup element.

How to enter the link to the target video

Steps:

1. Add a Video Popup instance to the edited page or post
2. Open the Settings for the added element
3. Open the "General" tab
4. Under "Video Url" paste the URL to one of the supported streaming services
5. Save changes.

How to choose video preview image

Steps:

1. Add a Video Popup instance to the edited page or post
2. Open the Settings for the added element
3. Open the "General" tab
4. Click "Show More Settings"
5. Under "Video Preview Image" select a Media section image
6. Save changes.

How to display the image as a background image, and fix the container element height (if the video popup is the only element in row)

Steps:

1. Add a Video Popup instance to the edited page or post
2. Open the Settings for the added element
3. Open the "General" tab
4. Click "Show More Settings"
5. Tick "Use Preview Image as Background?"
6. Tick "Set Height According to Image Size?"
7. Save changes.

How to change the video popup button icon

Steps:

1. Add a Video Popup instance to the edited page or post
2. Open the Settings for the added element
3. Open the "Icon" tab
4. Under "Icon Position" select the desired icon position, regarding the other textual content (title and text)
5. Choose the icon library and the icon itself
6. Save changes.

How to choose a title which will be displayed

By default, title will be rendered as a H3 tag.

Steps:

1. Add a Video Popup instance to the edited page or post
2. Open the Settings for the added element
3. Open the "Title" tab
4. In the "Title" field enter the desired text
5. Save changes.

How to choose a text which will be displayed

By default, text will be rendered with a body typography styles.

Steps:

1. Add a Video Popup instance to the edited page or post
2. Open the Settings for the added element
3. Open the "Text" tab
4. In the "Text" field enter the desired text
5. Save changes.

How to apply primary & secondary accent color to the element

See description here.

How to apply a basic styling, which applies to the element as a whole

See description here.