Embedding vertical video

[Paul_Hill_Guitarist]

What is the most efficient method of embedding a Youtube Shorts vertical video? I’m currently embedding the
Direct Video Link which gives regular video dimensions and I have tried to adjust the viewing size using various methods to crop to vertical video dimensions, although I have never been happy with the result.

Thought I would ask in case there is something obvious I am missing.

Thanks!

[ruenel]

Hello Paul,

Thanks for writing in!

Please use the Youtube Shorts Embedded Code instead.
https://www.youtube.com/results?search_query=how+to+embed+youtube+shorts+on+website

Once you have the embedded code, you can place the code in the Video element just like this:

Kindly let us know how it goes.

Hope this helps.

[Paul_Hill_Guitarist]

My problem is that Youtube shorts do not provide Embedded Code. If I use the Direct Video Link, I can embed the non-shorts horizontal video (width=“560” height=“315”), which results in the left and right 3rd of the video as blank.

Any options (including your link) advertise plugins to embed shorts. I am asking if there is a way to embed the Direct Video Link and ‘crop’ it to only show the middle 3rd using Cornerstone. I have nearly achieved this, but I cannot achieve a perfect result.

An example of currently embedded video is at https://guitartheoryandtechniquebook.com/guitar-sequences-melodic-patterns/. The thumbnail is width=“560” height=“315” dimensions as Youtube doesn’t allow specific shorts thumbnails. The thumbnail has the middle 3rd set so that can also be used as a vertical video thumbnail. If you click on a video, it is not the ideal setup.

Hopefully that makes sense!

Thanks.

[ruenel]

Hello Paul,

Regretfully we do not have any controls over Youtube videos. The Video element that we have in the builder is only a container that displays the video coming from its source.

Thank you for your understanding.

[Paul_Hill_Guitarist]

Thanks, but I should have written my original question more clearly.

I realise that there are no controls over Youtube videos. I am using the direct link for a Youtube Shorts video and I am trying to resize the video element so that it hides the outer 3rds of the ‘regular’ Youtube video so it displays as a Shorts video.

Shorts video: https://youtube.com/shorts/k-wH8RPcsvM
Direct link for the same video: https://youtu.be/k-wH8RPcsvM

I have nearly managed to achieve the look of the Shorts video using various resizing techniques in the code, using divs, etc., but the result is never perfect. This seems quite a basic thing to do, but I always seem to have some sort of odd border in my results, which is especially problematic with responsiveness.

[christian]

Hey Paul,

Shorts are embeddable. You just need to right-click.

Once you have the embedd code, paste it in the Video Embed box.

After that, adjust the Frame Ratio of the video to a portrait ratio like 2:3. You need to play with the ratio or contact Youtube support to learn the exact ratio the shorts videos use.

Hope that helps.

[Paul_Hill_Guitarist]

Right click… that simple! Maybe that is a new thing as I’m sure that wasn’t an option previously. I was using the share links as in regular Youtube videos. The frame sizing also didn’t seem to work when I tried previously, but now it is working perfectly.

Thanks, and sorry for the easy solution that I should have figured out. I had been travelling way too far down an unnecessary rabbit hole.

[ruenel]

You are most welcome, Paul.