Video Preview

This document explains the Display Video Previews option in the Video Options section of the Divi FilterGrid plugin. By default, this option is turned off. Once the option is turned on, the module will search for videos located within the post from one of the following sources:

• Video module
• Embedded video from the media library
• YouTube URL located within the post content
• Vimeo URL located within the post content

If a video is found, it will be embedded at the top of the post in the grid. This works similar to the default Divi blog module with one important distinction. Unlike the blog module, the post format does NOT need to be changed from Standard to Video. By removing this requirement, the video preview option can be used on any custom post type.

You can also manually define the preview video using a filter. Below are two examples using custom fields to define the video URL.

Another similarity to the default Divi blog module is how featured images are handled when videos are embedded. If a video is found in the post and the post has a featured image, the featured image will be displayed on top of the embedded video. Hovering over the image will display the video overlay with a play button icon. This overlay and icon can be modified in the Video Options section.

If a video is found in the post but the post does not have a featured image, the video will be displayed without an overlay.

If a video is not found in the post but the post has a featured image, the featured image will be displayed with the image overlay and icon. This overlay and icon can be modified in the Posts Elements section.

Video Click Action

Once the Display Video Previews option is turned on, other video options will become available. The first is Video Click Action which has two available selections:

• Play video (default)
• Play video in popup

If Play video is selected, clicking on the featured image (if present) or embedded video will play the video in place. If Play video in popup is selected, the video will load in a popup window and begin to play. If a video is not found in the post and a feature image is displayed instead, the click action will be whatever is set in the Click Action option at the top of the Posts Elements section (default is Link to post).

Video Overlay

The remaining options in the Video Options section control the overlay and overlay icon that are displayed if the post has a featured image. Both the overlay and icon can be turned on or off (on by default). If left on the overlay icon, icon color and overlay color can be modified.

Again if the post does not have a featured image, the overlay and icon will not be shown. If the post does have a featured image but does not have a video, the overlay and icon can be controlled in the Posts Elements section.

Custom Video Preview URL

There may be times when the automated options to find the video in your post are not going to work. In these cases, you can manually define the video URL. Below is an example of displaying a YouTube video in the preview from an ACF custom field:

The example above would also work for a Vimeo video.

Another example below is nearly identical, but in this example we are loading an internal video from the media library instead of from an external source: