# Responsive Video Embeds for Classic Themes

> Makes YouTube, Vimeo and other embedded videos scale to the width of the content on phones and tablets, for older themes that leave them at a fixed size.

- Type: PHP
- Runs: Frontend only
- Category: [Media](https://wpide.com/library/category/media/)
- Tags: embeds, video, responsive
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/responsive-embeds-classic-themes/

## Code

```php
add_filter( 'embed_oembed_html', function ( $html ) {
    if ( current_theme_supports( 'responsive-embeds' ) || wp_is_block_theme() || false === strpos( $html, '<iframe' ) || false !== strpos( $html, 'wpide-responsive-embed' ) ) {
        return $html;
    }

    $width  = preg_match( '/\swidth=["\']?(\d+)/i', $html, $w ) ? (int) $w[1] : 16;
    $height = preg_match( '/\sheight=["\']?(\d+)/i', $html, $h ) ? (int) $h[1] : 9;

    if ( ! $width || ! $height ) {
        $width  = 16;
        $height = 9;
    }

    return '<div class="wpide-responsive-embed" style="position:relative;width:100%;aspect-ratio:' . $width . '/' . $height . ';">' . $html . '</div>';
}, 20 );

add_action( 'wp_head', function () {
    echo '<style>.wpide-responsive-embed iframe{position:absolute;inset:0;width:100%;height:100%;}</style>' . "\n";
} );
```

## Notes

Block themes and themes that already declare responsive embeds are skipped automatically.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Responsive Video Embeds for Classic Themes" in its snippet library and add it in one click; or create a new PHP snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/