I recently made a YouTube video of my ProfilePress plugin and embedded it on the homepage of its site. Then I discovered it wasn’t responsive on mobile and the WordPress theme I used for the website has no responsive support for YouTube, Vimeo and any video embed.
I did some googling and saw a ton of tutorial to make YouTube video embed responsive. In my search for a solution, I discovered Jetpack has a responsive videos support feature that make sure that all videos display just as nicely on mobile devices as they do on your largest display.
Since I have Jetpack plugin installed on the site, it was a no-brainer for me to use it.
Responsive video support is by default disabled in Jetpack. To activate it, you will have to add the code below to your theme’s functions.php file or a site specific plugin.
/**
* Add theme support for Responsive Videos.
*/
function jetpackme_responsive_videos_setup() {
add_theme_support( 'jetpack-responsive-videos' );
}
add_action( 'after_setup_theme', 'jetpackme_responsive_videos_setup' );It’s that simple.
Every video on the site now display just as nicely on mobile devices as they do on any largest display.