[wp-trac] [WordPress Trac] #21540: Add support for responsive video embeds
WordPress Trac
noreply at wordpress.org
Thu Jan 17 17:24:46 UTC 2013
#21540: Add support for responsive video embeds
-------------------------+------------------------------
Reporter: obenland | Owner: Viper007Bond
Type: enhancement | Status: assigned
Priority: normal | Milestone: Awaiting Review
Component: Embeds | Version:
Severity: normal | Resolution:
Keywords: |
-------------------------+------------------------------
Comment (by mkokes):
I might be missing something but wouldn't anything being embedded into a
post be block content or at least treated as such? Tweet, poll, slideshow,
audio player, etc.
I've been using the following code in twenty twelve child themes to
maintain proper aspect ratios on video embeds delivered via oembed.
within functions.php, this adds a figure with a class of video-container
and a div with the class of video-wrapper
{{{
add_filter( 'embed_oembed_html', 'css_oembed_filter', 10, 4 ) ;
function css_oembed_filter($html, $url, $attr, $post_ID) {
$return = '<div class="video-wrapper"><figure class="video-
container">'.$html.'</figure></div>';
return $return;
}
}}}
then in the styling I use the following css
{{{
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.video-wrapper {
width: 960px;
max-width: 100%;
}
}}}
The video-wrapper class is only needed if you want to set a maximum width
for the video.
--
Ticket URL: <http://core.trac.wordpress.org/ticket/21540#comment:5>
WordPress Trac <http://core.trac.wordpress.org/>
WordPress blogging software
More information about the wp-trac
mailing list