Video module leaves black top and bottom

[Jo_Pitts1]

Hi there.  I'm mucking around with the video module in the starter templates.  When I embed a widescreen video from youtube, there are ugly black bars at top and bottom of the video thumbnail (i.e. letterboxing).

Does any one know how to resolve, or does anyone have an alternate piece of module code that does the same job and fixes the issue?

[Dave_Roberts]

Hey Jo-

This most likely has to do with the proportions of the container (maybe 16x9) compared to the proportion of the video (maybe 21x9). I don't think the Marketo Starter templates are setup to handle this kind of thing, but we might be able to get away with adding some Custom CSS either to the template or via the LP Editor (under Edit Page Metatags > Custom Head HTML) that'll help address the issue.

1. Could you let me know which template you're using from the library, and where you're adding the video? 
2. If you've got a link to preview the approved version of the page that's showing this error, that'd also be really helpful for anyone in the community to help troubleshoot this.
3. Are all of your videos widescreen, or do you have some that are normal and some that are widescreen? 
   If they're all a standard width, it'd make sense to update the template so that ANY video you put on the page will get the widescreen treatment. If not, it might make sense to either add this "as-needed" in the Custom Head HTML input and/or develop a toggle for the video element that'll allow you to switch between "widescreen" (21x9) and "normal" (16x9) modes.

[Melanie_Martin]

Hi,

I've been trying to create a video module today ad the problem actually stems from the thumbnail that is being generated from YouTube's API, e.g. it generates this 

https://img.youtube.com/vi/<video-id>/1.jpg

but we want it to generate one without the black, like this

https://i.ytimg.com/vi/<video id>/mqdefault.jpg

or

https://i.ytimg.com/vi/<video id>/maxresdefault.jpg

 Maybe Marketo can look into changing the default thumbnail.