ACF Dynamic field in Button lightbox link settings

[ijjimem]

Prerequisites

• [x] I have searched for similar features requests in both open and closed tickets and cannot find a duplicate.
• [x] The feature is still missing in the latest stable version of Elementor ( Elementor Pro. )

What problem is your feature request going to solve? Please describe. Enabling ACF dynamic link in the lightbox video URL field will make it easier to embed dynamic URLs for videos on websites. This will solve the need for popup plugins for videos.

Describe the solution you'd like Add a dynamic URL option to the video URL field in Lightbox.

Describe alternatives you've considered The second option is to add a 3rd type. •Image •Video •Plain (text, shortcode, and more with dynamic button option)

Additional context How I see it: https://ibb.co/0nkXrPZ

[ijjimem]

Another option I thought of: Make the Video element a choice between Image Overlay and Button. This would be fantastic also.

[opwolken]

Yes! this: https://ibb.co/0nkXrPZ I'm working on a page template in combination with ACF. I love the dynamic options that elementor has to offer but was wondering why this lightbox doesnt have one.

[ijjimem]

C'mon guys, is it so hard to implement?

[potentstudios]

1. Create a popup
2. Add a Video element
3. Assign ACF URL Field as the Link
4. Trigger the popup with whatever you want.

[idaniloreis]

@potentstudios The popup does not recognize the value of the custom field, so it does not create the video frame

https://prnt.sc/to5331

I also need this function because I list several types of posts that contain a video url field and I need to display the videos in a popup by clicking the button.

https://prnt.sc/to549p

[zeinnicholas]

+1

[shaneonabike]

+1

[huuHii]

+1

[tsz1412]

+1

[angelvilches]

+1

[askwpgirl]

@potentstudios The popup does not recognize the value of the custom field, so it does not create the video frame

https://prnt.sc/to5331

I also need this function because I list several types of posts that contain a video url field and I need to display the videos in a popup by clicking the button.

https://prnt.sc/to549p

I am successful in getting this to work with a Popup, so that is a good workaround until the Video Lightbox allows for dynamic tags.

[potentstudios]

@potentstudios The popup does not recognize the value of the custom field, so it does not create the video frame https://prnt.sc/to5331 I also need this function because I list several types of posts that contain a video url field and I need to display the videos in a popup by clicking the button. https://prnt.sc/to549p

I am successful in getting this to work with a Popup, so that is a good workaround until the Video Lightbox allows for dynamic tags.

Glad to hear it!

[potentstudios]

@potentstudios The popup does not recognize the value of the custom field, so it does not create the video frame

https://prnt.sc/to5331

I also need this function because I list several types of posts that contain a video url field and I need to display the videos in a popup by clicking the button.

https://prnt.sc/to549p

Are you adding the ACF link to a video element in the Elementor Popup? See screenshot: https://i.imgur.com/v3iHXaq.png

[askwpgirl]

Are you adding the ACF link to a video element in the Elementor Popup? See screenshot: https://i.imgur.com/v3iHXaq.png

Yes, I am. However, I do not use the ACF embed field but rather then ACF URL field. The URL field works fine. What type of ACF field are you trying to use? Also, are you using the real URL for the video as opposed to the share or embed URL?

[maxms]

Are you adding the ACF link to a video element in the Elementor Popup? See screenshot: https://i.imgur.com/v3iHXaq.png

Yes, I am. However, I do not use the ACF embed field but rather then ACF URL field. The URL field works fine. What type of ACF field are you trying to use? Also, are you using the real URL for the video as opposed to the share or embed URL?

I am using a popup with the ACF URL field and the real YouTube URL and it is not showing the video element at all because I need to use it in a loop. Having a dynamic video option in the lightbox would be ideal.

[Pietervdz]

3 years ago.. please add this!!! Had multiple situations where I needed this function

[kinokeo2]

Would love to see this added too!

[gerardreches]

+1 This should have been implemented already

[TOTLD]

+1 here.

Feature request has been closed but this is still not implemented as at Elementor Pro v3.14.0

Pop-ups are not a good solution to problems like these - they have SEO drawbacks and add clunk to pages that could use simpler lightbox functions.

[antoanst]

Hi everyone, I've come up with a simple workaround for this. Hopefully, the Elementor team will add the dynamic option for Lightboxes, until then it's possible via a small JS code hijacking the click and a 3rd party library for the lightboxes (Elementor's default lightbox seems to be unavailable). https://github.com/antoanst/elementor-loop-dynamic-lightbox

[temsool]

Hi everyone, I've come up with a simple workaround for this. Hopefully, the Elementor team will add the dynamic option for Lightboxes, until then it's possible via a small JS code hijacking the click and a 3rd party library for the lightboxes (Elementor's default lightbox seems to be unavailable). https://github.com/antoanst/elementor-loop-dynamic-lightbox

Thank you so much! works very well, also modified a little bit jquery part to work in action to call card widget

 jQuery('.js-video-lightbox .elementor-cta').on('click', function(e) {
        e.preventDefault(); // Prevents default link action
        jQuery(this).magnificPopup({
            type: 'iframe'
        }).magnificPopup('open');
    });

[gsqrt2]

Here is a backend oriented, workaround. No need to burden the frontend with additional scripts and libraries. It utilizes a shortcode to construct the reverse engineered string exactly the way Elementor handles the static urls.

It is made for video urls and more specifically youtube, but it is very easy to modify for images or other video providers as per your needs:

// Generate custom href to open lightbox for dynamic url
// Usage: [mbn_generate_lightbox_link custom-field="your custom field name"]
// Return string format:
// '#elementor-action%3Aaction%3Dlightbox%26settings%3D' . base64_encode({"type":"video","videoType":"youtube","url":"'. addslashes($embed_url) .'"})
add_shortcode('mbn_generate_lightbox_link', function($atts=[]){
    $href = '';
    if( $atts['custom-field'] ){
        $url = get_post_meta( get_the_ID(), $atts['custom-field'], true );

                // Youtube specific transformations

        $video_id = explode("?v=", $url); // For videos like http://www.youtube.com/watch?v=...
        if (empty($video_id[1]))
            $video_id = explode("/v/", $url); // For videos like http://www.youtube.com/watch/v/..

        $video_id = explode("&", $video_id[1]); // Deleting any other params
        $video_id = $video_id[0];
        $embed_url = 'https:\/\/www.youtube.com\/embed\/'.$video_id.'?feature=oembed';

                // End of Youtube specific transformations

        $data = '{"type":"video","videoType":"youtube","url":"'.$embed_url.'"}';
        $href = '#elementor-action%3Aaction%3Dlightbox%26settings%3D'.base64_encode($data);
    }
    return $href;
});

You can now add [mbn_generate_lightbox_link custom-field="your custom field name"] to the dynamic option "shortcode" and get the desired behavior.

[daniilicic]

@gsqrt2 this works perfectly. Thanks!

Though, would be nice to have a native option for pulling the video URLs to lightbox dynamically.