Search
Close this search box.

How to Add Dynamic Video in Elementor with ACF

The ability to create custom templates and add custom fields makes it possible for you to create any type of website using Elementor. Say you want to create a movie review website and plan to add a trailer video — which you take from YouTube — for every single review you write. In this case, you ideally create a custom post type and then create a custom template for it. You can use CPT UI (Custom Post Type UI) to create a custom post type, while to add custom fields to the custom post type you created you can use ACF (Advanced Custom Fields). With the help of ACF, you can add dynamic video to a custom template you create with Elementor.

Step 1: Create the custom fields

First, you need to create a custom field group with ACF. When creating a field group, make sure to add a field with the field type of URL.

You can assign the custom field group to a default post type (blog post) or a custom post type as mentioned above. For more detailed instructions on how to create custom fields in ACF, you can refer to this page.

Once done creating the custom fields, create a new post where the custom field group is assigned to. Paste the URL of the video you want to add to the video URL field.

Publish the post once you are done filling out all fields.

Step 2: Create a custom template

Next, you can create a custom template for the custom post type (or default post type, depending on where you want to add the dynamic video). In this example, we will create a custom template for a custom post type. Go to Templates -> Theme Builder and click the Single Post tab. Click Add New to create a new custom template.

Give your template a name and click the CREATE TEMPLATE button to start creating the template.

On the Elementor editor, add the Video widget to the canvas area.

Go to the settings panel on the left side. Click the dynamic icon on the Link field under the Video block. Select ACF URL Field.

On the ACF URL Field, click the wrench icon and select a key (custom field) according to the video URL field you created with ACF on the step 1 above.

That’s it.

You can click the Image Overlay block on the settings panel to add a custom overlay to the video. You can also use a dynamic overlay if you want it. To do so, first, you can add a custom field with the field type of Image. Then, click the dynamic icon on the image picker and select ACF Image Field and then tailor the key according to the field name you set for the image overlay.

You can publish your template you are done editing it.

PS

If you experience an issue when working with custom fields in Elementor (e.g., custom fields don’t show up), you can refer to this post to fix it.

This page may contain affiliate links, which help support our project. Read our affiliate disclosure.
Picture of Editorial Staff

Editorial Staff

WordPress page builder tutorials, tips, and resources
Want to turn your WordPress knowledge into revenue? OF COURSE!

5 thoughts on “How to Add Dynamic Video in Elementor with ACF”

  1. Wonder if you have a suggestion for posts that won’t have a video URL added; was hoping that Elementor would simply remove the block when this was the case, but it doesn’t and you end up with a dead video box.

    Reply
  2. When creating a loop with Ele Custom Skin, the dynamic option no longer seems to be available, which is strange. The URL field does not show in the key. I’ve been searching for an answer to the issue, but haven’t found it yet.

    Reply

Leave a Comment

Share This
Haven’t used Elementor Pro yet?
Hey 👋🏻
Do you have a WP blog?
If so, you may need these. All the resources you need to grow your blog.

Your popup content goes here

50%

Where should we send the template?

After entering your email address, you will be added to our newsletter subscribers. You can unsubscribe anytime.

Want to Build Passive Income Like the One on the Screenshot Below?

Click the button on the right side to learn how 👉🏻
5 easy steps to turn your WordPress knowledge into monthly recurring revenue.

Click the above button to close the popup.