Lightbox Auto-open & play on page load

I am wondering if there is a way that we can add a video into a lightbox that loads and opens on page load.
My client has a new feature video and simply wants the video to pop up and start playing as people visit their site and then allow the users to click out of it (lightbox feature) and continue navigating the site.

Hi @jwren, One way you can achieve this is by making a custom lightbox with interactions and setting it to appear on page load.

This demo will show you how to make the interaction, but instead of selecting a “Click Interaction” choose “Page Load”:

Demo: https://preview.webflow.com/preview/demokit?preview=72388b288a26874be319ca1f7412d4eb
Page Title: Custom Lightbox

If you still need a hand, let me know and I’ll try to make a demo specific to this question. :smile:

I did not get the implementable here. Can you please explain?

Hey,

@thewonglv is partialy correct. The issue might be at the moment when user clicks off the lightbox which should not only close it, but also stop the video. If the video is just hidden, then it will continue playing. Not being able to open the lightbox with video again will lead to frustration.

I wouldn’t recommend having that from UX side, but instead have a hero section at the top with that video. That way users will have an option to play the video or not.

@srinath If you still want to have that working, you might need to give us more info like if the video will be hosted on Youtube or Vimeo. Also the preview of your website would be handful. Instructions on what is that preview and how to share with us you can find in a link below.

@thewonglv I didn’t find the demo you spoke about on your website. Although I have found “Supported languages” and in Polish there is a mistake ;) It should be “Wspieramy ten język” instead of “Popieramy ten język” :)

@srinath Please give us more details and a shared link (instructions above). You might need to hard-code that or hire someone to do that for you.

Hi Bartosz!

I’m trying to achieve the same thing as @jwren do you have a solution for this? The video I’m using is on youtube and here is the shared link https://preview.webflow.com/preview/mdclivearts-b9eab1d1e65fdebc843f6ae891b?preview=27c9f8c02692fb9ca0dc5972fe20fe15

Youtube Video: Teatro Cinema: Historia de Amor Trailer - YouTube

Should I create a light box for it?