Change default size of Player in Video Lightbox

Quick question — I am using the Video Lightbox to embed a Vimeo clip. However, it always displays the video at 940x529px and not at the size of the video or any other metric.

Looking at the published source code, it appears the master container for the video is wp-player-layout, which then has a style tag applied (post, in the code) which is restricting it to those pixel dimensions above.

Despite putting in a custom style in the header code for wp-player-layout and setting the sizes to 100vh and 100vw (or anything, in fact), gets ignored and overridden by that post styled element on publish.

Is there any way I can change this? The site is using near-full-width images for the user to click and play the HD video, and the video is coming up half the size of the thumbnails… looks broken.

Here’s the share link - click Portfolio, then scroll to first image and click.

https://preview.webflow.com/preview/hawaii-video-memories?preview=7c36c1a35d518596ccec9a3055976594

Hope this is an easy one to override. Thank you!

You have to override both the frame div and iframe embed:

.w-lightbox-frame, .w-lightbox-embed {
    width: 100vw;
    height: 100vh;
}

wp-player-layout isn’t the div you’re looking for.

If you need help with custom code in your projects you can contact me here

3 Likes

Hey Sam,

Thank you SO much! I went through the source code trying to find the master container names, but there were so many. This nailed it right away — very much appreciated!

In this same vein, could you tell me why my style override for the .w-lightbox-close isn’t working?

Thank you again sir,

Steve

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.