Archived topic
Youtube Video Too Big
6 replies · Started by Jam on December 2, 2015
Hi Tom
I'm having problems with the Youtube embed. It's too big (more long than wide) on the page. When I change the theme to the wordpress 2015 theme, this doesn't happen so I'm thinking it is a GeneratePress problem. I have also tried to install the responsive column widgets theme but that doesn't make it it any better.
Thanks a lot
Hi there,
GP tells WordPress the width of your content area so the auto embed of galleries, videos etc.. will fill the area.
To avoid this, simply choose your own video size when getting the embed code from YouTube - this will guarantee the video is the exact size you need it to be.
Let me know if you need more info :)
Hey Tom
thanks a lot for the very quick reply. Just one more quick question. Will the video be responsive this way? Cheers
You'll need to add this CSS:
.videoWrapper {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
}
.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
Then wrap your video in the videoWrapper class:
<div class="videoWrapper">
<iframe src="youtube..." />
</div>
Thanks so much Tom. Off to try that now.
Just did it. Works like magic.. a hundred thank yous -- :-)
You're welcome :)