How to Add 9:16 Videos Side-by-Side in Webflow?

Design help Custom code
1

Hi everyone,
I hope you’re all doing well!

I’m trying to add a 9:16 ratio video to my Webflow page, but I noticed that the only option available is to add videos via URL. Is there a way to upload videos directly, similar to how we upload images?

Additionally, I have two 9:16 videos that I’d like to display side by side on the page. Could anyone guide me on how to achieve that?

I also tried uploading one of the videos to YouTube and embedding it in Webflow using a URL. Even though it’s a Shorts video, I still see grey areas around the video, which doesn’t look great. (i deleted the video later) Is there any way to avoid this issue and get the two 9:16 videos aligned side by side for a better layout?

I’d be really grateful for any advice or suggestions! Thank you in advance!

sdfsdfdddsdf.PNG
sdfsdfdddsdf.PNG1192×751 47.3 KB

Here is my site Read-Only: Webflow - Sustainability Jobs List

2

I’d stick with the YouTube approach for simplicity.
My notes here should help with the aspect ratio;

If you want more player control, the easiest low-tech route might be Vidzflow. Next up would be Vimeo, or hosting on Cloudflare R2, Bunny .net, or Amazon S3.

1 Like
3

Thank you…! After adding the ratio, the grey area disappeared, which is great. However, the video now appears stretched across the screen. i deledted video…

sdfsfds.PNG
sdfsfds.PNG1850×841 85 KB

4

You can just give it a size like any element.

1 Like
5

thanks @memetican … :slight_smile: