Lightbox Video on button?

[lentaspace]

Hi! I’ve found in documentation a way to have a video with LightBox when they click an image but I would like to have the same functionality on a button. I’ve tried a few options but it doesn’t work.

This is the video on image code
[x_image class=“videoLightbox” src=“IMAHELINK” link=“true” href="//www.youtube.com/embed/E2sSvVCRI4s" lightbox_video=“true”]
[x_lightbox selector=".videoLightbox" deeplink=“true” opacity=“0.875” prev_scale=“0.75” prev_opacity=“0.75” next_scale=“0.75” next_opacity=“0.75” orientation=“horizontal” thumbnails=“false”]

Has anyone made it work on a button?

[jade]

Hi Ryan,

You have set the videoLightbox selector to the lightbox shortcode:

[x_lightbox selector=".videoLightbox" deeplink="true" opacity="0.875" prev_scale="0.75" prev_opacity="0.75" next_scale="0.75" next_opacity="0.75" orientation="horizontal" thumbnails="false"]

So please try adding the button element to your page, click on customize then set videoLightbox as the class.

Let us know how it goes.

[lentaspace]

Thanks @Jade, it works now but the difference is that the video is full width? Is used to be small and centered (with some padding around).

How could I add that back?

Thanks

[ruenel]

Hello Ryan,

Getting the video smaller may need custom css. May I recommend something else? Please utilize the Content Area Modal element. Insert the Youtube Embed code in the Content Area and then you will have to tweak the Toggle icon to make it like a button and not a circle toggle icon. You will need to set the width and height to auto

And then disable the graphic set up and enable the text setup. If you want an example, we can create one for you.

Best Regards.