Custom Width and Height for Youtube shorts

[cdo9]

Before using this package i was doing this :

<iframe loading="lazy" width="315" height="560"
    class="lazyload my-0 mx-auto"
    src="https://www.youtube-nocookie.com/embed/{{ $youtubeVideoId }}"
    title="YouTube video player"
    frameborder="0"
    allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
    allowfullscreen=""></iframe>

Is it possible to do something similar for embedding youtube shorts ?

[cdo9]

I found my answer alone, sorry :)

<lite-youtube videoid="{{ $youtubeVideoId }}" class="mx-auto" style="width: 315px; height: 560px;" playlabel="Play: Keynote (Google I/O '18)"></lite-youtube>

[cdo9]

I reopen this cause my workaround is not doing exactly the same.

[Wolfleader101]

bump any solutions for embedding shorts?

[Milkywayrules]

curious, I wanna try this library, but can we actually embed Shorts? Is your problem only with the styling and not the embedded Short functionality?

cc @cdo9

[Wolfleader101]

curious, I wanna try this library, but can we actually embed Shorts? Is your problem only with the styling and not the embedded Short functionality?

cc @cdo9

Never got this library working so just stuck with standard iframes
i.e

      <iframe
        width="315"
        height="560"
        src="https://www.youtube.com/embed/Ce1xtpew1Qo"
        title="YouTube video player"
        allow="accelerometer; autoplay; clipboard-write; encrypted-media;
gyroscope; picture-in-picture;
web-share"
        allowfullscreen></iframe>
        

Works fine for me.

[cdo9]

I am now doing this, but not using this package anymore, using this one : https://github.com/justinribeiro/lite-youtube - I don't remember why I've switched but it's working well for me like this :)

<div class="max-w-3xl mx-auto">
    @if($isVideoFormatPortrait)
        <lite-youtube videoid="{{ $youtubeVideoId }}" short></lite-youtube>
    @else
        <lite-youtube videoid="{{ $youtubeVideoId }}"></lite-youtube>
    @endif
</div>