Change Homepage Slider to Youtube video Aspect ratio issue.

Hello,

I am attempting to embed a youtube video in the home page slider.

When the video is displayed the video is shown in a letterbox 4:3 aspect ratio instead of 16:9 aspect ratio.

This is causing a black letter box.

Here is the embed code I have placed in the #1 Slider image field:
<iframe width="694" height="345" src="//www.youtube.com/embed/aPf7d0PTni4?autoplay=1&controls=0&showinfo=0&rel=0&modestbranding=1" frameborder="0"></iframe>

When you view the video on youtube it clearly is in 16:9 aspect ratio with no letterbox!


Please advise!

 

Here is the homepage link http://daycareed.com/

 

Hello,

For this firstly go to your YouTube account and click the edit option of that video and in "Tags" section text box add the code given below

Code:

yt:stretch=16:9
 

After that add its embed code and upload it in your slider. This will solve your issue.



Thanks & Regards
Gourav Shrivastava

 

I have already tried this.

no change

 

Hello,

Theme slider show the video from the embed code of YouTube, So we can't do much in it.

Thanks & Regards
Gourav Shrivastava

 

Can you provide me the CSS code to change the size of the slider container this way I can play with the width and height to get the aspect ratio correct?

I adjusted the iframe width percentage and now the video is being displayed not full container but without the black lines.

http://daycareed.com

 

Hello,

Paste this code in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

.flexslider {
width: 692px;
}

Adjust its value as per your requirements.

Thanks & Regards
Gourav Shrivastava

 

Thanks you can mark this closed!