Embed videos aspect ratio

The CMS Questions
1

Hello :slight_smile: I use the video block to embed videos from Vimeo in my site. since some of the videos in this website are old they have different aspect ratio.

I would need to give the wrapper element of the video some padding like this: padding of 56.2% 0 0 0 so they could be shown with their full width and height, but some videos don’t fit to this magic number and it causes black gaps at the top and the bottom of the video. is there a way to get the aspect ratio of the video through Kirby video block?

I stumbled upon this protocol called oEmbed and I was wondering if there’s a way to use it with Kirby as well. Or maybe there is a different way in Kirby to show videos with full width and height with their correct ratio.

Thanks in advance! :pray:

2

Maybe store this information in your video block via additional width/height fields?

3

Thanks! sounds good - how do I add additional field to the video block in the yml file?

  gallery: 
    type: fields
    fields: 
      media: 
        type: blocks
        fieldsets:
            - video
            image:
              name: image
              icon: images
              fields:
                image:
                  type: files
4

In the same way as you have modified the image block, i.e. overwrite video.yml. But if I were you, I wouldn’t do this in the page blueprint, but overwrite image.yml and video.yml in /site/blueprints/blocks to keep your page blueprint clean.

1 Like
5

Ahh I see! now I understand how I can edit the block elements. it’s very useful :slight_smile:

thank a lot :pray:

6

There’s also this field plugin: GitHub - sylvainjule/kirby-embed: Embed field for Kirby 3.
It automatically queries the source and stores different stuff about the embed (like height, width, and aspect ratio).

You could use that field in your video block

1 Like