Question:
Here’s the situation: I am a freelance designer, creating a website for a Director of Photography/Cinematographer. He wants a masonry gallery of thumbnails that, when clicked, open a Lightbox to their respective videos. I need this to be responsive.
Ideally, this would also allow me to list the title, production details, etc. under the video in the Lightbox. Essentially, I want the site to function like THIS SITE, with the only difference being the masonry gallery layout.
Product:
Wix Studio Editor
What are you trying to achieve:
Basic: Video Lightbox that works on all breakpoints and orientations.
What have you already tried:
I’ve used Wix Pro Gallery - and it has worked for the most part. However, some of the breakpoints aren’t working correctly. (Ex: Mobile landscape - I can’t scroll to see the video controls)
I don’t think there is a native solution… but is there ANY way to achieve this?
(I am not much of a coder - but I can follow explicit instructions)
I built this small page to demonstrate dynamically controlling gallery image actions
In that page, two of the gallery images link to external sites (which are not currently online), and the other two open a lightbox
The lightbox that opens contains a simple image element that gets populated with the image clicked on
This can work in the exact same fashion for a video and any other data of those images
What he wants is something similar to what is displayed when you click the 1st image (American Girl)… with the video info. Since I cannot get the Lightbox to scroll in mobile, unless you have a solution on how to make this work too, I’m giving up on having the information shown and am willing to have the Lightbox be JUST the video. (Although this is still where I’m having layout/sizing issues)
Chances are I’m just doing something basic incorrectly or am overlooking something simple, but would you be willing to take a look and provide some insight?
The issue now - I upload a video to the media manager. I upload an image I want to use as the thumbnail. Since the Vimeo player is automatically a 16:9 aspect ratio video player, it forces the thumbnail image to be 16:9. I want the images I upload as the thumbnails to maintain their uploaded aspect ratio - whether that be 1:1, 4:5, 16:9, etc. I chatted with a Wix rep and they said that the only way to do that would be through Velo code.
(In the example above, the image I uploaded as the thumbnail for the guy looking down at the screen is 4:5, but it is displaying as 16:9… It should be 4:5, like the photo of the girl with the red shirt)