Responsive Embeds
An opt-in wrapper that makes oEmbed output keep its aspect ratio at any width. When a child theme declares the support, method_responsive_embed_wrap() (lib/theme-setup.php) filters every embed whose <iframe> declares a width and height, wraps it in .method-embed and sets --embed-ratio from those two numbers; the companion styles in global.scss give the wrapper aspect-ratio: var(--embed-ratio, 16 / 9) and stretch the iframe to fill it.
How it works
method_maybe_enable_embed_wrap()runs onafter_setup_themeat priority 11 — after a child theme’s ownafter_setup_themecallback at the default priority — and only ifcurrent_theme_supports( 'method-responsive-embeds' ). It then attachesmethod_responsive_embed_wrap()toembed_oembed_htmlandoembed_resultat priority 20.- The wrapper returns the HTML untouched when it is not a string, is empty, already contains
method-embed, or has no iframe with numericwidthandheightattributes — so providers that size their iframes with CSS are left alone. - The ratio is written as
--embed-ratio: W / H, so a 560×315 YouTube embed becomes 16:9 and a 4:3 Vimeo embed stays 4:3; nothing assumes a single ratio.
Enabling it
PHP
// Child theme functions.php
add_action( 'after_setup_theme', function () {
add_theme_support( 'method-responsive-embeds' );
} );
Output, for a 560×315 embed:
HTML
<div class="method-embed" style="--embed-ratio: 560 / 315">
<iframe width="560" height="315" src="https://www.youtube.com/embed/…"></iframe>
</div>
Changelog
| Version | Description |
|---|---|
| 2.0.0-beta17 | Introduced as an opt-in: method_maybe_enable_embed_wrap(), method_responsive_embed_wrap(), the method-responsive-embeds theme support and the .method-embed styles (b4c7dcb). |