[Support request] How to Make Embedded YouTube Video Responsive?

[Jericho]

Hi Tom & Support Team,

A few weeks ago, we decided to recreate all of our posts and turn them into a video then embed the video back to the original post.

We are using the Embed YouTube block on Gutenberg and it looks fine in the backend but once you hit publish, you will see some extra black space on top and below the embedded video.

Screenshot: http://prntscr.com/m88zue

Also, when we check the video on mobile, it’s not responsive and the video was very tall.

Screenshot: http://prntscr.com/m8901h

I try googling the issue and found this: https://wordpress.org/gutenberg/handbook/designers-developers/developers/themes/theme-support/#responsive-embedded-content

Can you guys, please help me fix this issue?

Thanks very much,
Jericho

[Leo]

Hi there,

This should help: https://generatepress.com/forums/topic/feature-request-responsive-videos/#post-757711

[Jericho]

Hi Leo,

Where and how to add the code?

Thanks!
Jericho

[David]

Hi there,

the code is PHP:

https://docs.generatepress.com/article/adding-php/

[Jericho]

Got it! I used Code Snippets and it worked!

Thanks!

[David]

Awesome. Glad we could help.

[Author]

Posts