Overview
If you have been wondering how to automatically add a video in Divi with dynamic content from a custom field, rejoice! We have the solution! The Divi Dynamic Helper plugin by Pee-Aye Creative automatically adds a dynamic content icon to the default Divi Video module. This means you can add the standard Divi Video module to any page, post, or Theme Builder template and paste a video URL into a custom field, and it will always play the correct video! Save yourself a lot of hassle, or just use this method to keep clients out of the builder. Our plugin is the only solution on the market for this, so we hope you appreciate and enjoy this exciting advanced feature!
This video and full written guide below will show you step by step how to set up the custom fields and use the new Divi Video module dynamic content setting.
If you already have your custom fields set up, and you are ready, this GIF provides a brief visual overview of the remaining steps needed to use this feature.
Set Up The Custom Fields
Before you can automatically display a video in the Divi Video module using dynamic content, you must first set up the custom field to provide a source for the video. Custom fields allow you to assign and manage additional information, such as URLs, files, or embeds, directly from the WordPress post editor. Please refer to our Custom Fields Documentation for more information on how to set up custom fields in WordPress.
Supported/Tested Custom Fields
Currently, Divi Dynamic Helper supports and has been tested with several popular custom field solutions. We recommend using Advanced Custom Fields (ACF) due to its extensive options, integration capabilities, and widespread usage among WordPress users.
Advanced Custom Fields (ACF)
Advanced Custom Fields (ACF) is the most popular custom field solution for WordPress, and we highly recommend using it due to its robust options and broad integration capabilities. The following ACF field types work well for displaying dynamic videos within the Divi Video module:
Field Type: Text
This is a simple input field for pasting a video URL. You can use it to embed videos from popular platforms such as YouTube or Vimeo by simply entering the link.
Field Type: Link
This field accepts URLs from external sources like YouTube and Vimeo. While you can link directly to videos hosted elsewhere, it’s also possible to upload video files to your WordPress media library and use video file formats like MOV, MP4, and WEBM. However, we advise against uploading large video files due to potential performance issues.
Field Type: File
The file field allows you to select a video from your WordPress media library, making it possible to use video files like MOV, MP4, or WEBM. However, as mentioned earlier, it’s better to avoid uploading large video files to WordPress and instead host them externally.
Field Type: oEmbed
The oEmbed field is designed for embedding videos from platforms like YouTube and Vimeo. It automatically detects and embeds the video content once you enter the URL.
Field Type: WYSIWYG
This field supports embedding iframe codes, making it useful for embedding videos from YouTube and Vimeo by pasting their iframe codes.
Other Supported Custom Field Solutions
In addition to ACF, Divi Dynamic Helper has been tested with the following custom field solutions:
- WordPress Custom Fields (native)
- Pods
- Meta Box
- Toolset
These plugins offer similar functionality, allowing you to set up custom fields for your videos and pull them into the Divi Video module dynamically.
Note: Other plugins and custom field solutions may also work with the Divi Dynamic Helper, but they have not been officially tested. Custom setups and unique scenarios outside of the above may require additional testing or adjustments.
General Recommendations for Handling Large Files
When using the Divi Video module with dynamic content, it’s important to consider the size of your media files. Video files, in particular, tend to be quite large, which can negatively affect the performance of your WordPress site if uploaded directly to your server. Large video files can lead to slower page load times, increased server load, and higher bandwidth consumption, especially for sites with significant traffic.
For this reason, we highly recommend hosting your videos on a professional video hosting platform such as YouTube, Vimeo, or Wistia. These platforms are specifically designed to handle video streaming and offer better performance, scalability, and bandwidth management. Once hosted on an external platform, you can simply place the video URL into a custom field, which the Divi Video module will pull dynamically.
While WordPress does allow you to upload video files directly, it’s generally not advisable unless the video file is small and your hosting server is robust enough to handle the load. Most standard shared hosting environments aren’t equipped for streaming large media files, so using external hosting is the best practice.
Add the Divi Video Module To Your Layout Or Template
Once your custom fields are set up and configured, the next step is to add the Divi Video module to your layout using the Divi Builder. Whether you’re designing a single page or creating dynamic templates for multiple posts or post types, linking the Divi Video module to your custom field via dynamic content is an invaluable solution provided by our plugin.
Divi Video Module Added to Divi Theme Builder Templates
The Divi Theme Builder is an essential part of building dynamic websites. It allows you to create templates that automatically display content, such as videos, by linking to the custom fields you’ve configured. The most common and powerful use case is when the Divi Video module is included in a Theme Builder template. This setup enables the module to pull video links dynamically from custom fields, ensuring that each instance of the module on different pages or posts displays the appropriate video based on the specific content. For example, if you’re building a blog or portfolio, you can create a single template for posts or projects, and each video will be automatically populated from the assigned custom field for that particular post or project. This approach is particularly beneficial for websites with dynamic content structures, as it significantly reduces the time spent on manual updates.
Divi Video Module Added Directly to a Page or Post
The Divi Video module can be placed directly onto any page or post within the Divi Builder. This method is less common since it doesn’t utilize dynamic content to simply add the video directly inside the module. However, if you need to add the video dynamically from a custom field, this scenario works great.
Link The Video Module To The Custom Field
1. Add/Open The Video Module
The next step is to add the Divi Video module to your layout. Simply go to your Visual Builder and click the gray plus (+) icon to add a new module and select the Video module. If you already have a Video module in your layout, be sure to remove any existing video file from the Content tab>Video toggle>Video MP4 File Or YouTube URL field.
2. Remove Any Existing Video
When you first add a Video module to a Divi layout, it already contains a placeholder video from the Elegant Themes YouTube channel. In order to access the new dynamic content icon, you first need to remove any existing video by hovering over the video preview and clicking the trash icon.
3. Click The Dynamic Icon Button
Now that the placeholder or existing video is removed, hover over the video field, and you will see the new dynamic content icon appear in the upper right corner of the Video MP4 File Or YouTube URL field. NOTE: This icon only appears when the Divi Dynamic Helper plugin is active.
4. Select The Custom Field Name
When you click the dynamic content icon, a new window will appear with a list of all the available custom fields on the site. Fields added via the standard WordPress editor or with plugins like Pods, Meta Box, and Toolset will appear under the gray “Custom Fields” heading, while fields added with the ACF plugin will appear under a separate section. You can now select the custom field that you have set up and designated for the video URL.
Note: Your custom field name will be different than shown in our screenshot, based on whatever you have named it when setting up the custom field.
5. Save The Custom Field Selection
Once you select the video URL custom field, another window will appear. This window is not relevant in our case, so just ignore it and click the green checkmark to save/close the window.
6. Save The Module Settings
At this point, you are finished with the setup. Be sure to save the module settings, and when you exit the builder, you will see the Divi Video module contains the video and can be played from the custom field. Everything else about the Video module can be adjusted according to your preference and will work just like normal.